@charset 'UTF-8';

/****************************************
body
全体の背景色：＃fff
メインの青：#0C88BF
薄い青　#71B8D1
****************************************/

body {font-family: 'Noto Sans JP', sans-serif; color: #32312d;}
img { max-width: 100%; height: auto;}
ul, ol {margin: 0; padding: 0;}
/****************************************
メイン領域のレイアウト
****************************************/

/*********************************************
/*
/* Header領域のスタイル
/*
/********************************************/

.head_sp {display: block;}
.pc_header_container {display: none;}
.header_shipping_container {display: none;}
.header_banner_area {margin-bottom: 20px;}
.container {margin: 0; padding: 0;}

@media screen and (min-width:1024px) {
/*　for PC　*/
 	.container {max-width: 1500px; margin: 0 auto;}
	.head_sp {display: none;}
	.pc_header_container {width: 100%;padding-bottom: 90px;	display: block;	background: #fff;}
	.pc_header {max-width: 1500px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-end;}
	.pc_header .rogo {width: 118px;  margin: 65px 0 0 140px;}
	.pc_header .rogo img {width: 118px;}
	.pc_header .g_menu {display: block; width: 403px; margin: 0 70px 0 auto;}
	.pc_header .g_menu ul {margin: 0 0 0 auto;	padding: 10px 0 0 0;list-style: none; writing-mode: vertical-rl;}
	.pc_header .g_menu li img {margin: 0}
	.pc_header .g_menu li a img:hover {opacity: 0.8}
	.pc_header .sub_menu {display: block; width: 315px; margin: 50px 0 auto 0;}
	.sub_menu_icon ul {padding: 0 0 0 0;list-style: none; display: flex; margin: 0 0 25px 70px;}
	.pc_header .sub_menu_icon a.icon_fb img {display: block; width: 30px; margin: 0 30px 0 0;}
	.pc_header .sub_menu_icon a.icon_instagram img {display: block; width: 30px; margin: 0 40px 0 0;}
	.pc_header .sub_menu_icon a.icon_netshop img {display: block; width: 47px; }
}






/****************************************
.スマホ用グローバルメニュー
****************************************/
.head_sp .site-logo img {display: block;width: 13%; text-align: center; margin: 20px auto;}
.head_sp {background: #fff;}

.menuarea {background: #eee;}
@media screen and (min-width: 768px) {
	.menuarea {border: none;padding-bottom: 30px;}
}

/* トグルボタン */
#menubtn {padding: 6px 12px;border: solid 1px #fff;	border-radius: 5px;	background-color: #fff;	position: absolute;top: 28px;right: 15px;cursor: pointer}
#menubtn:hover	{opacity: 0.8}
#menubtn:focus	{outline: none}
#menubtn i	{color: #32312d;font-size: 20px}
#menubtn span	{display: inline-block;text-indent: -9999px}

/* グローバルメニュー */
#menu {display: none;}
.menu ul {margin: 0;padding: 0;list-style: none;}
.menu li a {display: block;	padding: 10px;color: #000!important;font-size: 14px;text-decoration: none;}
.menu li a:hover {color: #eee;}


/****************************************
.パンくずリスト 未使用
****************************************/
.breadcrumb { padding: 0; background: none; margin: 20px 0;}
.breadcrumb li+li:before { content: '»';}

/****************************************
タブメニュー 未使用
****************************************/
.nav-pills {margin-bottom: 20px;}
.nav-pills li a {background-color:#eee;	margin: 0 5px 5px 0;}
.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {background-color:#EA617C;}
.nav-pills>li.active>a:hover {background-color:#FF9999;}

/*********************************************
/*
/* TOPページのスタイル
/*
/********************************************/
.top_main {margin: 0 0 20px 0;}

.top_main_comment1{font-size: 12px; margin: 50px 30px;}
.top_main_comment1 p{margin: 0; padding: 0;}
.top_main_comment2{font-size: 12px; margin: 50px 30px; border: solid #b3ccd3 2px; padding: 20px;}
.top_main_comment2 p{margin: 0; padding: 0;}

.space_shoping {margin: 0 0 70px 0;}
.space_purchase {margin: 0 0 70px 0;}
.space_repair {margin: 0 0 30px 0;}

.top_youtube {width: auto; background: #32312d; margin: 30px auto; padding: 12px;}
.youtube_midashi {display: block; width: 75px; margin: 15px auto;}
.box_youtube {background: #3e3a39; padding: 20px 0; font-size: 12px;}
.top_youtube_detail {background: #e4e4e5; padding: 10px;}
.top_youtube_info {margin: 0; color: #32312d;}
.top_youtube_date {color: #32312d; margin: 0;}
.top_youtube_link a {display: block; color: #3e3a39; background: #fff; text-align: center; padding: 5px; margin: 10px 0}
.top_youtube_link a:hover {background: #ECECEC; text-decoration: none;}
.top_youtube_link .fas {color: #baa160; margin: 0 0 0 10px;}
.rental_midashi {display: none; width: 100px;}
.contact_midashi {display: none; width: 100px;}

/* タブレット、パソコン表示用 */
@media screen and (min-width: 768px) {
.top_main {margin: 225px 0 30px 0;}
.top_main_comment1 {font-size: 20px; width: 580px; margin: 100px auto 100px auto;}
.top_main_comment1 p{margin: 0; padding: 0;}
.top_main_comment2{font-size: 20px; width: 850px; margin: 50px auto 260px auto; border: solid #b3ccd3 2px; padding: 60px;}
.top_main_comment2 p{margin: 0; padding: 0;}

.sub_banner a img {display: block; margin: 0 auto 70px auto; width: auto;}
.top_youtube {background: #fff; width: 1120px; margin: 0 auto; padding: 20px 0;}
.youtube_midashi {display: block; width: 195px; margin: 110px auto 40px;}
.top_youtube_detail {padding: 30px;}
.top_youtube_info {margin: 0; color: #32312d;}
.top_youtube_date {color: #32312d; margin: 0;}
.top_youtube_link {text-align: right; margin: 0;}
.top_youtube_link a {display: inline-block; color: #3e3a39; background: #fff; padding: 10px 30px;}
.top_youtube_link a:hover {background: #ECECEC; text-decoration: none;}
.top_youtube_link .fas {color: #baa160; margin: 0 0 0 10px;}

	
.rental_midashi {display: block; width: 150px; margin: 110px auto 40px;}
.contact_midashi {display: block; width: 180px; margin: 110px auto 40px;}
}
/* /TOPページのスタイル */


/*********************************************
/*
/* コンテンツページのスタイル
/*
/********************************************/

/* タブレット、パソコン表示用 */
@media screen and (min-width: 768px) {
	.main_contents {width: 1120px; margin: 100px auto 0 auto;}
}

/* 問い合わせページ用 */
.inquiries_form h1 {font-size: 20px; text-align: center;}
a.btn_inquiries {background: #b3ccd3; padding: 10px 30px; color: #000; display: block; margin: 0 auto; width: 350px;}
a.btn_inquiries:hover {opacity: 0.8;}
@media screen and (min-width: 768px) {
	.inquiries_btn_box {width: 700px; margin: 0 auto 30px auto;}
}

/* テキスト　センター */
.text_center {text-align: center;}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
.pc { display: none !important; }
.sp { display: block !important; }
}


/****************************************
ページ内設定
****************************************/

.font_red {color: #ff0000;}

/* スペースの設定 */
.space_u10 {margin: 0 0 10px 0;}
.space_u20 {margin: 0 0 20px 0;}
.space_u30 {margin: 0 0 30px 0;}
.space_u40 {margin: 0 0 40px 0;}
.space_u50 {margin: 0 0 50px 0;}
.space_o20 {margin: 20px 0 0 0;}
.space_o50 {margin-top: 50px !important;}

/* /スペースの設定 */

/* 画像の回り込み */
.image-right {padding: 0px;float: right;margin: 10px 0 10px 10px;}
.image-left {float: left;padding: 0px;margin: 10px 10px 10px 0;}
/* /画像の回り込み */

/* リンク付き画像の半透明 */
a.opacity{background-color:#FFF; display:inline-block;}
a.opacity:hover img,
a.opacity:active img{
    -moz-opacity:0.7;
   opacity:0.7;
   filter:alpha(opacity=70);
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

/****************************************

各種見出しのスタイル

****************************************/
/* ページ上部の見出し */
.maintitle {font-size: 22px; line-height: 1.2; margin: 0 0 10px 0; color: #222;}
@media screen and (min-width: 768px) {
.maintitle { font-size: 36px;}
}
.maintitle:before { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 4px; content: '';}

/* 第1サブ見出し。下線付き。 */
.subtitle {font-size: 20px; color: #222; text-align: center; border-bottom: 1px solid #222; margin-bottom: 20px; padding-bottom: 10px;}
@media screen and (min-width: 768px) {
	.subtitle {font-size: 25px;	text-align: left;}
}

/* 第2サブ見出し */
.subtitle2 {font-size: 25px;margin: 0 0 30px 0;}

/* 第3サブ見出し */
.subtitle3 {font-size: 20px;color: #0C88BF;	margin: 0;font-weight: bold;}

/****************************************
Googleマップ　レスポンシブ対応
****************************************/
.ggmap {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.ggmap iframe,.ggmap object,.ggmap embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


/*********************************************
/*
/* Footer
/*
/********************************************/

/****************************************
.btn-pagetop
****************************************/
.btn-scroll a {margin: 30px 0 0 0;display: block;background: #939393;padding: 10px 0;color: #fff;font-size: 20px;}
.btn-scroll a i{font-size: 18px;margin-right: 10px;}
.btn-scroll a:hover {opacity: 0.8;text-decoration: none;}

/****************************************
.footer
****************************************/
.footer_message {background: #e2c4b5; }
.footer_message p {font-family: 'Noto Sans JP'; margin: 0; padding: 10px; text-align: center; font-size: 12.5px; letter-spacing: 0.1em;}

.footer {background: #DCE6E6; padding: 20px;}
.footer_container_sp {margin: 0 auto; padding: 40px 15px}
.foot_inquiry_sp {margin: 0 0 6% 0;}
.foot_rogo_sp {margin: 0 0 3% 0;}
.foot_tel_sp {margin: 0 0 3% 0;}
.foot_fax_sp {margin: 0 0 6% 0;}
.foot_map_sp {margin: 0 0 6% 0;}

@media screen and (min-width: 768px) {
.footer_container_sp {display: none;}
.footer_message p {margin: 0; padding: 18px; font-size: 23px;}
.footer_container {width: 100%; margin: 0 auto; width: 720px;}
.tel_fax {margin: 120px 0 60px 0;}
.access_directions {font-family: 'Noto Sans JP'; margin: 40px auto; font-size: 20px; line-height: 2em; letter-spacing: 0.1em;}
}

/*
ボタンの設定
*/
.btn-pink {color: #fff;background-color: #333;}
.btn-pink:hover {color: #fff; background-color: #333;}
/*
Bootstrapのグリッド間隔（ガター）を調整するためのCSS設定。
TOPページのメニュー一覧部分に使用。
*/

/*溝幅 20pxの場合*/
.gutter-20{margin-left:-10px;margin-right:-10px;}
.gutter-20 > [class*='col-'] {padding-left:10px;padding-right:10px;}

/*溝幅 10pxの場合*/
.gutter-10{margin-left:-5px;margin-right:-5px;}
.gutter-10 > [class*='col-'] {padding-left:5px;padding-right:5px;}

/*溝幅 0pxの場合*/
.gutter-0{margin-left:0;margin-right:0;}
.gutter-0 > [class*='col-'] {padding-left:0;padding-right:0;}


/*********************************************
/* 着物買取ページのスタイル
/********************************************/
.purchase_s1_midashi{margin: 24px auto 33px auto; padding: 0 15px;}
.purchase_coment_1 {font-family: 'Noto Sans JP'; margin: 0 0 50px 0; padding: 0 35px; text-align: center; font-size: 12.5px; line-height: 2em; letter-spacing: 0.1em;}
.under_line_light_purple {background:linear-gradient(transparent 60%, #D8CCDD 60%);}
.purchase_fukidashi {display: block; margin: 50px auto; width: 100%; padding: 0 33px;}

.purchase_coment_2 {font-family: 'Noto Sans JP'; letter-spacing: 0.1em;}
.bg_purchase {background: #eeeeef;}
.purchase_s2 {padding: 0 0 18% 0}
.purchase_s2_midashi{display: block; width: 44%; margin: 0 auto; padding: 30px 0 37px 0;}
.purchase_s2_coment {padding:0 50px; font-size: 11px; margin: 0 auto; line-height: 2em;}
.purchase_s2_coment ul {margin: 0 0 0 25px; padding: 0 0 0 0;}
.purchase_s2_coment p {margin: 50px 0 0 0;}

.purchase_s2_notpurchase {font-size: 11px; line-height: 2em; border: solid 2px #fff;margin: 30px 33px;}
.purchase_s2_notpurchase1 {background: #fff; padding: 20px;}
.purchase_s2_notpurchase2 {padding: 20px;}
.purchase_s2_notpurchase p {margin: 0;}
.purchase_s2_notpurchase ul {margin: 0 0 0 25px; padding: 0 0 0 0;}

.purchase_s2_parking{border-top: solid #32312d 1px; border-bottom: solid #32312d 1px; padding: 30px;margin: 30px 33px;}
.purchase_s2_parking h2{font-size: 11px; border-left: solid #b3ccd3 8px; padding:0 0 0 10px; margin: 0 0 10px 0;}
.purchase_s2_parking p{font-size: 11px;}
.parking_margin{margin: 0 0 10px;}

@media screen and (min-width: 768px) {
.purchase_coment_1 {width: 570px; margin: 0 auto; text-align: left; font-size: 20px; line-height: 2em; letter-spacing: 0.1em;}
.purchase_s1_midashi{margin: 0 auto 80px auto;}
.purchase_fukidashi {margin: 50px 20px;}
.bg_purchase {background: #eeeeef;}
.purchase_s2 {padding: 0 0 130px 0}
.purchase_s2_midashi{display: block; width: 640px; margin: 0 auto; padding: 120px 0 60px 0;}
.purchase_s2_coment {width: 660px; font-size: 20px; margin: 0 auto; line-height: 2em; letter-spacing: 0.1em;}
.purchase_s2_coment ul {margin: 0 0 0 40px;}
.purchase_s2_coment p {margin: 70px 0 0 0;}
.purchase_s2_notpurchase {font-size: 20px; line-height: 2em; width: 700px; margin: 50px auto;}
.purchase_s2_notpurchase1 {background: #fff; padding: 20px;}
.purchase_s2_notpurchase2 {padding: 20px;}
.purchase_s2_notpurchase p {margin: 0;}
.purchase_s2_notpurchase ul {margin: 0 0 0 25px; padding: 0 0 0 0;}
.purchase_s2_parking{padding: 90px;margin: 30px 33px;}
.purchase_s2_parking h2{font-size: 24px;padding:0 0 0 10px; margin: 0 0 30px 0;}
.purchase_s2_parking p{font-size: 20px;}
.parking_margin{margin: 0 0 60px 0;}
}

/*********************************************
/* お仕立て・お直しページのスタイル
/********************************************/
.repair_s1 {padding: 0 15px}
.repair_nouki {display: block; width: 250px; margin: 50px auto;}
.repair_coment_1 {font-family: 'Noto Sans JP'; margin: 0 0 50px 0; padding: 0 35px; text-align: center; font-size: 12.5px; line-height: 2em; letter-spacing: 0.1em;}
.bg_repair_s2 {background: #e2c4b5; padding: 30px 15px;}
.repair_s2_midashi {display: block; width: 200px; margin: 0 auto;}
.repair_s2_coment {padding:0 50px; font-size: 12.5px; margin: 0 auto; line-height: 2em;}
.bg_repair_s3 {background: #b3ccd3; margin: 50px 0 100px; padding: 30px 15px;}
.bg_repair_s3_2 {margin: 50px 0 100px; padding: 30px 15px; border: solid 3px #b3ccd3;}
.repair_s4_midashi{display: block; width: 44%; margin: 0 auto; padding: 30px 0 37px 0;}
.repair_s4 {margin: 0 0 50px 0;}

@media screen and (min-width: 768px) {
.repair_nouki {display: block; width: 500px; margin: 50px auto;}
.repair_coment_1 {width: 670px; margin: 100px auto; text-align: left; font-size: 20px; line-height: 2em; letter-spacing: 0.1em;}
.repair_s2_midashi {display: block; width: 200px; margin: 0 auto;}
.repair_s2_coment {width: 670px; font-size: 20px; margin: 0 auto; line-height: 2em; letter-spacing: 0.1em;}	
.repair_s3 img {width: auto; margin: 0 auto 100px;}
.repair_s4_midashi{display: block; width: 350px; margin: 0 auto; padding: 120px 0 60px 0;}

}

/*********************************************
/* レンタルページのスタイル
/********************************************/
.rental_s1 {margin: 50px 15px; font-size: 12.5px;}
.rental_s1_midashi {display: block; width: 120px; margin: 0 auto;}
.rental_price {font-family: 'Noto Sans JP';}
.rental_price_uline {border-bottom: solid 1px #32312d;}
.rental_coment_1 { background: #b3ccd3; padding: 10px;}
.rental_coment_1 p {font-size: 12.5px; margin: 0; padding: 0;}

.rental_s2 {margin: 50px 15px; font-size: 12.5px; border: solid 1px #b3ccd3; padding: 20px; position: relative;}
a.rental_s2_btn {display: block; width: 150px; position: absolute; right: 30px; bottom: -10px;}
.list_check {padding: 0px;margin: 0px;list-style: none;}
.list_check > li { position: relative; padding: 0px 0px 0px 2em; margin: 0px;}
.list_check > li::before {position: absolute;top: 50%;left: 0px;transform: translateY(-75%) rotate(45deg); width: 0.5em; height: 1em; border-bottom: 3px solid #b3ccd3; border-right: 3px solid #b3ccd3; content: "";}
.list_check > li + li { margin: 1em 0px 0px;}
.rental_s2_2 a {display: block; color: #fff; background: #e54038; text-align: center; margin: 50px 15px 100px; font-size: 12.5px; padding: 10px;}
.rental_s2_2 a:hover {text-decoration: none; opacity: 0.8;}
.bg_rental_s3 {margin: 50px 0; padding: 30px 15px;}
.rental_s4 {margin: 50px 15px;}
.rental_s4_midashi {display: block; width: 100px; margin: 0 auto 30px auto;}
.rental_s4 .gallary img {margin: 0 0 10px;}

@media screen and (min-width: 768px) {
.rental_s1 {width: 1100px; margin: 100px auto; font-size: 20px;}
.rental_s1_midashi {width: 200px; margin: 0 auto 50px;}
.rental_coment_1 {padding: 20px;}
.rental_coment_1 p {font-size: 20px; text-align: center;}
.rental_s2 {width: 800px; margin: 50px auto; font-size: 20px; padding: 50px; position: relative;}
a.rental_s2_btn {display: block; width: 300px; position: absolute; right: 80px; bottom: -15px;}
.rental_s2_2 a {width: 800px; margin: 160px auto 200px; font-size: 20px; padding: 10px;}
.rental_s3 {width: auto; margin: 50px auto;}
.rental_s4 {width: 1120px; margin: 200px auto;}
.rental_s4_midashi {width: 200px; margin: 0 auto 50px auto;}
.rental_s4 .gallary img {margin: 0 0 30px;}
}

/*********************************************
/* お店紹介ページのスタイル
/********************************************/
.info_s1{margin: 50px 15px;}
.info_s2 {margin: 50px 15px;}
.info_s2_img {display: block; width: 80%; margin: 0 auto;}
.info_s3 {margin: 50px 15px;}
.info_s3 img {width: auto;}
a.info_btn {display: block; padding: 5px; text-align: center; background: #b3ccd3; color: #3e3a39; text-decoration: none; margin: 0 0 50px 0;}
a.info_btn:hover {opacity: 0.8;}
a.info_btn .fas {color: #baa160; margin: 0 0 0 10px;}
.info_s4 {margin: 50px 15px; border-bottom: solid 1px #3e3a39; padding: 0 0 20px 0;}
.info_s4 p {font-family: 'Noto Sans JP'; text-align: center; margin:0 0 10px 0; padding: 0;}
.info_s4 .sns {width: auto; display: flex; margin: 0 auto;}
.info_s4 .sns a {display: block; width: 50px; margin: 0 10px;}
.info_s5 {margin: 50px 15px;}
.info_s5 img {width: auto;}

@media screen and (min-width: 768px) {
.info_s1 {width: 670px; margin: 100px auto; text-align: left; font-size: 20px; line-height: 2em; letter-spacing: 0.1em;}
.info_coment_2{text-align: center; font-size: 16px;}
.info_s2 {display: block; width: 600px; margin: 0 auto;}
.info_s3 {width: 800px; margin: 100px auto;}
a.info_btn {width: 150px; padding: 5px;margin: 0 0 100px auto;}
.info_s4 {width: 670px; margin: 50px auto 150px;}
.info_s4 p {font-size: 20px; margin: 5px 0 0 0;}
.info_s5 {width: 1120px; margin: 100px auto 200px;}
}

/*********************************************
/* 問い合わせページのスタイル
/********************************************/
.inquiries_s1 {margin: 50px 15px 0;}
.inquiries_s1 img {display: block; width: 80%; margin: 0 auto 30px auto;}
.inquiries_s2 {margin: 0 15px; text-align: center;}
.inquiries_s3 {margin: 50px 15px 50px 15px;}
.inquiries_s3 a {display: block; width: 80%; margin: 0 auto; padding: 5px; background: #b3ccd3;text-align: center; color: #3e3a39; border-radius: 5px; text-decoration: none;}
.inquiries_s3 a:hover {opacity: 0.8;}

@media screen and (min-width: 768px) {
.inquiries_s1 {width: 800px; margin: 100px auto 0 auto; text-align: left; font-size: 20px; line-height: 2em; letter-spacing: 0.1em;}
.inquiries_s1 img {display: block; width: auto; margin: 0 auto 30px auto;}
.inquiries_s2 {width: 670px; margin: 50px auto; text-align: center; font-size: 20px; line-height: 2em; letter-spacing: 0.1em;}
.inquiries_s3 {width: 670px; margin: 50px auto 100px auto;}
.inquiries_s3 a {width: 500px; font-size: 20px; padding: 10px;}
}

/*********************************************
/* アクセスページのスタイル
/********************************************/
.bg_access {background: #90c2ce; margin: 50px 0 0 0; padding: 30px 0;}
.access_box {width: auto; margin: 0 15px;}
.access_title {display: block; margin: 50px auto 50px auto; width: 60px;}
.access_map {margin: 0 0 50px 0;}
.access_box_comment1{font-size: 12.5px; margin: 50px 0 30px 0;}

@media screen and (min-width: 768px) {
.bg_access {margin: 100px 0; padding: 100px 0;}
.access_box {width: 1120px; margin: 0 auto;}
.access_title {display: block; margin: 0 auto 50px auto; width: 100px;}
.access_map {margin: 0 0 100px 0;}
.access_box_comment1{font-size: 20px; text-align: center; margin: 160px 0 60px 0;}
}