@charset "UTF-8";
/* CSS Document */
/* ブレイクポイントここから

@media (max-width: 600px){}

@media (min-width: 600px) and (max-width: 959px){}

@media (min-width: 960px) and (max-width: 1280px){}

@media (min-width: 1281px) {}

ブレイクポイントここまで */




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








.desktop_body{z-index: auto !important;}

@media (max-width: 600px){.pc_view{display: none!important;}}
@media (min-width: 600px){.sp_view{display: none!important;}}






/* アンカーずれ修正ここから */

#kikaku_wrapper .anchor{width:100%; height: auto; display: block;}

@media (max-width: 599px){#kikaku_wrapper .anchor{margin-top: -70px!important; padding-top:70px!important; }}
@media (min-width: 600px) and (max-width: 999px){#kikaku_wrapper .anchor{margin-top: -70px!important; padding-top:70px!important;}}

@media (max-width: 600px){
	#kikaku_wrapper .anchor{margin-top: -20px!important; padding-top:20px!important; }
}
@media (min-width: 600px) {
	#kikaku_wrapper .anchor{margin-top: -20px!important; padding-top:20px!important;}
}

/* アンカーずれ修正ここまで */







/* 全体WRAPPER */

#kikaku_wrapper{background: #EDEFF2; padding: 0 0 80px; color:#222;}

#kikaku_wrapper *{box-sizing: border-box; text-transform: none!important;}

#kikaku_wrapper ul,#kikaku_wrapper li{list-style: none;}
#kikaku_wrapper ul{font-size: 0;}



/* リンク設定 */

#kikaku_wrapper a:hover img{
  opacity: 1.0;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
}


#kikaku_wrapper a img:hover{
	  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
	transition: .3s;
}


/* 画像設定 */

#kikaku_wrapper img{width:100%; vertical-align: middle;}



/* 白WRAPPER */
.white_wrapper{background: #fff; margin:0 auto;}

@media (max-width: 600px){
	.white_wrapper{
		width:100%;
		padding: 20px;
	}
}
@media (min-width: 600px) {
	.white_wrapper{
		max-width: 700px;
		width:calc(100% - 40px);
		padding: 40px;
	}
}



/* レイアウト */

@media (max-width: 600px){
	.white_wrapper, .first_title_wrapper, .mokuji_wrapper{margin-bottom:50px;}
	.topic_wrapper{margin-bottom: 100px;}
}
@media (min-width: 600px) and (max-width: 700px){
	.white_wrapper, .first_title_wrapper, .mokuji_wrapper{margin-bottom:100px;}
}
@media (min-width: 700px) {
	.white_wrapper, .first_title_wrapper, .mokuji_wrapper{margin-bottom:100px;}
}




/* セパレーター */
#kikaku_wrapper .separator{}
@media (max-width: 600px){#kikaku_wrapper .separator{margin-top:50px!important;}}
@media (min-width: 600px) and (max-width: 750px){#kikaku_wrapper .separator{margin-top:70px!important;}}
@media (min-width: 750px) {#kikaku_wrapper .separator{margin-top:100px!important;}}


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

/* ------------------------ */
/* フォント */
/* ------------------------ */

/* 地の文 */
#kikaku_wrapper .white_wrapper p{
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
	line-height: 2em;
}

@media (max-width: 600px){#kikaku_wrapper .white_wrapper p{font-size: 10px;}}
@media (min-width: 600px){#kikaku_wrapper .white_wrapper p{font-size: 12px;}}


/* 見出し */
#kikaku_wrapper .white_wrapper h1{
  font-family: "Shippori Mincho", serif;
  font-weight: 800;
  font-style: normal;

	letter-spacing: 0.07em!important;
}


@media (max-width: 600px){#kikaku_wrapper .white_wrapper h1{font-size: 12px;}}
@media (min-width: 600px){#kikaku_wrapper .white_wrapper h1{font-size: 15px;}}

/*

@media (max-width: 600px){#kikaku_wrapper .white_wrapper h1{font-size: 14px;}}
@media (min-width: 600px){#kikaku_wrapper .white_wrapper h1{font-size: 20px;}}

*/


#kikaku_wrapper .white_wrapper h2{
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}


@media (max-width: 600px){#kikaku_wrapper .white_wrapper h2{font-size: 12px;}}
@media (min-width: 600px){#kikaku_wrapper .white_wrapper h2{font-size: 15px;}}



#kikaku_wrapper .white_wrapper h3{
  font-family: "Shippori Mincho", serif;
  font-weight: 800;
  font-style: normal;
}


@media (max-width: 600px){#kikaku_wrapper .white_wrapper h3{font-size: 15px;}}
@media (min-width: 600px){#kikaku_wrapper .white_wrapper h3{font-size: 18px;}}



#kikaku_wrapper .white_wrapper h4{
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

@media (max-width: 600px){#kikaku_wrapper .white_wrapper h4{font-size: 12px;}}
@media (min-width: 600px){#kikaku_wrapper .white_wrapper h4{font-size: 14px;}}


#kikaku_wrapper .white_wrapper h4 span{font-size: 0.8em; color:gray; margin-left: 1em;}














/* ///////////////////////////////////////////// */
/* ------------------------ */
/* 背景色ボックス */
/* ------------------------ */


/* ------------------------ */
/* 共通ボックス */
/* ------------------------ */
.background-box{
	width: 100%;
	padding: 80px 0;
}




/* ------------------------ */
/* インナーボックス */
/* ------------------------ */
.inner-wrapper{
	background-color: #fff;
	margin: 0 auto;
}


@media (max-width: 600px){
	.inner-wrapper{
		width:100%;
		padding: 40px 20px;
	}
}
@media (min-width: 600px){
	.inner-wrapper{
		max-width: 700px;
		width:calc(100% - 40px);
		padding: 80px 40px;
	}
}


/* ///////////////////////////////////////////// */
/* ------------------------ */
/* ページタイトル */
/* ------------------------ */

#sec-title{background-color: none; padding-top:0;}


/* PC用バナー */
.banner-wrapper .pc_banner{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}


/*　SP用バナー　*/
.banner-wrapper .sp_banner{
	width: 100%;
	margin-top: 50px;
}


/* レイアウト */
@media (max-width: 600px){
	.banner-wrapper .pc_banner{display: none;}
}
@media (min-width: 600px){
	.banner-wrapper .sp_banner{display: none;}
}



/* ------------------------ */
/* イントロテキスト */
/* ------------------------ */
#sec-title .text-wrapper h1, #sec-title .text-wrapper h2{
	font-family: "Shippori Mincho B1", serif;
	font-style: normal;
	color:#222;
}

#sec-title .text-wrapper p{
	  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  line-height: 2em;
}

#sec-title .text-wrapper h1, #sec-title .text-wrapper h2{font-weight: 900; line-height: 1.8em;}



@media (max-width: 400px){
	#sec-title .text-wrapper{padding: 40px;}
	#sec-title .text-wrapper h2{font-size:15px;}
	#sec-title .text-wrapper h1{font-size:20px;}
	#sec-title .text-wrapper p{font-size:12px;}
}
@media (min-width: 400px) and (max-width: 600px){
	#sec-title .text-wrapper{padding: clamp(40px, -40px + 20vw, 80px);}
	#sec-title .text-wrapper h2{font-size:clamp(15px, 5.008px + 2.5vw, 20px);}
	#sec-title .text-wrapper h1{font-size:clamp(20px, 10px + 2.5vw, 25px);}
	#sec-title .text-wrapper p{font-size:clamp(12px, 6px + 1.5vw, 15px);}
}
@media (min-width: 600px) {
	#sec-title .text-wrapper{padding: 80px;}
	#sec-title .text-wrapper h2{font-size:20px;}
	#sec-title .text-wrapper h1{font-size:25px;}
	#sec-title .text-wrapper p{font-size:15px;}
}






/* ///////////////////////////////////////////// */
/* ------------------------ */
/* 飾り線 */
/* ------------------------ */

.color-line{
	display: block;
	width: 100%;
	height: 1.5px;
	background-color: #98a83d;
}



/* ///////////////////////////////////////////// */
/* ------------------------ */
/* 商品紹介メニュー */
/* ------------------------ */
.item-menu-sec{
	background-color: #fff;
}



/* メニュー */
.item-menu-wrapper{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 20px;
	width: calc(100% - 40px);
	max-width: 900px;
	margin: 0 auto;
}

.item-menu-wrapper a{display: block;}

@media (max-width: 400px){
	.item-menu-wrapper a{width: calc(50% - 10px);}
}
@media (min-width: 400px) and (max-width: 600px){
	.item-menu-wrapper a{width: calc(50% - 10px);}
}
@media (min-width: 600px) {
	.item-menu-wrapper a{width: calc(25% - 15px);}
}


/* ///////////////////////////////////////////// */
/* ------------------------ */
/* 商品共通セクション */
/* ------------------------ */

.item-all-sec{
}

.item-all-sec .inner-wrapper{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

/* ------------------------ */
/* 　コーデ別　 */
/* ------------------------ */

.item-all-sec .coordinate-col{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}


/* 紹介テキスト */
.item-all-sec .coordinate-col .text{
    position: relative;
    padding: 1.5em;
    max-width: 100%;
    width: 100%;
    text-align: center;
    margin: 0 auto;
	text-align: justify;
}

.item-all-sec .coordinate-col .text p{
	margin: 0;
	padding: 0;
}

.item-all-sec .coordinate-col .text::before,
.item-all-sec .coordinate-col .text::after{
    content:'';
    width: 30px;
    height: 30px;
    position: absolute;
    display: inline-block;
}

.item-all-sec .coordinate-col .text::before{
    border-left: solid 1px #222;
    border-top: solid 1px #222;
    top:0;
    left: 0;
}

.item-all-sec .coordinate-col .text::after{
    border-right: solid 1px #222;
    border-bottom: solid 1px #222;
    bottom:0;
    right: 0;
}


/* ------------------------ */
/* 着用アイテムリンク */
/* ------------------------ */

.item-all-sec .coordinate-col .link-wrapper{
	border: 1px solid #222;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 20px;
}

.item-all-sec .coordinate-col .link-wrapper::before{
	content: 'Items';
	width: 100%;
	display: block;
	border-bottom: 1px solid #222;
	text-align: left;
}


/* 商品別 */

.item-all-sec .coordinate-col .link-wrapper a{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 10px;
	-webkit-box-align: baseline;
	    -ms-flex-align: baseline;
	        align-items: baseline;
}

.item-all-sec .coordinate-col .link-wrapper a .price{
	margin-left: auto;
}

.item-all-sec .coordinate-col .link-wrapper a .price::before,
.item-all-sec .main-item .right .price::before{
	content: '\0a5';
	margin-right: 0.2em;
	font-size: 0.8em;
}

.item-all-sec .coordinate-col .link-wrapper a .price::after,
.item-all-sec .main-item .right .price::after{
	content: '(tax in)';
	margin-left: 0.2em;
	font-size: 0.8em;
}

.item-all-sec .coordinate-col .link-wrapper a .button,
.item-all-sec .main-item .right .button{
	background-color: #222;
	color: #fff;
	padding: 0.2em 0.5em;
	min-height: auto;
	min-width: auto;
	font-size: 0.9em;
}


/* ------------------------ */
/* メイン商品紹介 */
/* ------------------------ */

.item-all-sec .main-item{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.item-all-sec .main-item .right{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}





/* フォント */
.item-all-sec .coordinate-col .link-wrapper::before,
.item-all-sec .coordinate-col .link-wrapper a .price,
.item-all-sec .coordinate-col .link-wrapper a .button,
.item-all-sec .main-item .right .price,
.item-all-sec .main-item .right .button{
	  font-family: "Shippori Mincho B1", serif;
  font-weight: 600;
  font-style: normal;
}

.item-all-sec .coordinate-col .text p,
.item-all-sec .coordinate-col .link-wrapper a .name,
.item-all-sec .main-item .right .name{
	  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

/* ------------------------ */
/* レイアウト */
/* ------------------------ */



@media (max-width: 400px){
	.item-all-sec .inner-wrapper,
	.item-all-sec .coordinate-col{gap: 40px;}
	.item-all-sec .coordinate-col .link-wrapper{padding: 20px;}

	/* メイン商品 */
	.item-all-sec .main-item{gap: 10px;}
	.item-all-sec .main-item .left{width: 80%;}
	.item-all-sec .main-item .right{width: 100%; gap: 10px;}

	/* フォント */
	.item-all-sec .coordinate-col .text p,
	.item-all-sec .coordinate-col .link-wrapper a,
	.item-all-sec .main-item .right{font-size: 13px;}
	
}
@media (min-width: 400px) and (max-width: 600px){
	.item-all-sec .inner-wrapper,
	.item-all-sec .coordinate-col{gap: clamp(40px, 10vw, 60px);}
	.item-all-sec .coordinate-col .link-wrapper{padding: clamp(20px, -20px + 10vw, 40px);}

	/* メイン商品 */
	.item-all-sec .main-item{gap: clamp(10px, -10px + 5vw, 20px);}
	.item-all-sec .main-item .left{width: 80%;}
	.item-all-sec .main-item .right{width: 100%; gap: 10px;}

	/* フォント */
	.item-all-sec .coordinate-col .text p,
	.item-all-sec .coordinate-col .link-wrapper a,
	.item-all-sec .main-item .right{font-size: clamp(13px, 5.008px + 2vw, 17px);}
	
}
@media (min-width: 600px) {
	.item-all-sec .inner-wrapper,
	.item-all-sec .coordinate-col{gap: 60px;}
	.item-all-sec .coordinate-col .link-wrapper{padding: 40px;}

	/* メイン商品 */
	.item-all-sec .main-item{gap: 20px;}
	.item-all-sec .main-item .left,
	.item-all-sec .main-item .right{width: calc(50% - 10px); gap: 20px;}

	/* フォント */
	.item-all-sec .coordinate-col .text p,
	.item-all-sec .coordinate-col .link-wrapper a,
	.item-all-sec .main-item .right{font-size: 17px;}
}



/* リンク設定 */

.item-all-sec .coordinate-col .link-wrapper a:hover,
.item-all-sec .main-item:hover{color: #222;}

/* ///////////////////////////////////////////// */
/* ------------------------ */
/* hoge */
/* ------------------------ */



/* ///////////////////////////////////////////// */
/* ------------------------ */
/* 全体共通レイアウト */
/* ------------------------ */





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










/* ///////////////////////////////////////////// */
/* ------------------------ */
/* トピックス */
/* ------------------------ */






.topic_wrapper{
	padding: 0;
}

/* 画像単独1枚 */
.topic_one_img{padding: 5px;}

/* タイトル */
.topic_title{
	border-top:1px solid;
	border-bottom: 1px solid;
	padding: 20px 10px;
	margin-bottom: 40px;
	text-align: center;
}

.topic_title h1{
	line-height: 2em;
	font-family: "Shippori Mincho", serif;
	font-weight: 700 !important;
	font-style: normal;
}

.topic_title h1 span{font-size:0.8em !important;}


@media (max-width: 400px){
	.topic_title h1{font-size:20px !important;}
	.first_topic_title h1{font-size:16px !important;}
}
@media (min-width: 400px) and (max-width: 700px){
	.topic_title h1{font-size:clamp(20px, 13.328px + 1.67vw, 25px) !important;}
	.first_topic_title h1{font-size:clamp(16px, 4px + 3vw, 25px) !important;}
}
@media (min-width: 700px) {
	.topic_title h1{font-size:25px !important;}
	.first_topic_title h1{font-size:25px !important;}
}



/* サブタイトル */
.topic_sub_title{
	margin-bottom: 20px;
	border-left: 2px solid;
	padding-left: 20px;
}

.topic_sub_title h2{
	text-align: justify;
	line-height: 2em;
}




/* 本文 */

.topic_text_wrapper{text-align: justify;}
.topic_text_wrapper p{margin:0;}

@media (max-width: 600px){
	.topic_text_wrapper{margin:20px 0;}
}
@media (min-width: 600px) and (max-width: 700px){
	.topic_text_wrapper{margin:30px 0;}
}
@media (min-width: 700px) {
	.topic_text_wrapper{margin:30px 0;}
}



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




/* ///////////////////////////////////////////// */
/* ------------------------ */
/* FEATURES */
/* ------------------------ */

.fw_category_wrapper{text-align: center;}

.fw_category_wrapper h3{margin:1.5em 0 2em;}



/* カテゴリー一覧 */
/* PC表示 */
.pc_cate_wrapper{
	padding:20px;
	display: -webkit-box;
display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	border-top:2px solid;
	border-bottom: 2px solid;
	margin-bottom: 2rem;
}

.pc_cate_wrapper li{
	width:calc(25% - 20px);
	margin: 20px 0;
}

@media (max-width: 600px){.pc_cate_wrapper{display: none!important;}}
@media (min-width: 600px) and (max-width: 750px){}
@media (min-width: 750px) {}

/* SP表示 */


.sp_cate{
	padding: 0;
	margin: 0 20px;
	display: -webkit-box;
display: flex;
	overflow-x: auto;
	max-width: 800px;
}

.sp_cate li{
	text-align: center;
	padding: 0 1.5rem 1rem 0;
	flex-shrink: 0;
}

.sp_cate li:last-child{padding: 0 0 1rem 0;}

.sp_cate li img{height: 75px!important; width:auto!important;}





.sp_cate::-webkit-scrollbar {
  height: 5px; /* スクロールバーの高さ */
}
 
.sp_cate::-webkit-scrollbar-thumb {
  background: gray; /* ツマミの色 */
  border-radius: 2.5px; /* ツマミ両端の丸み */
}
 
.sp_cate::-webkit-scrollbar-track {
  background: #e6e6e6; /* トラックの色 */
  border-radius: 2.5px; /* トラック両端の丸み */
}










/*全体*/
.sp_cate_wrapper{
	position: relative;
}

.sp_cate_wrapper::before{
	  content: "";
  display: inline-block;
  width: 12px; /* スマホで見た時の幅 */
  height: 12px; /* スマホで見た時の高さ */
  background: url(https://www.rakuten.ne.jp/gold/styleformom/pc/img/btn/left.png) no-repeat;
  background-size: contain;
  margin-right: 3px;
	position: absolute;
	left:5px;
	top:40px;
}

.sp_cate_wrapper::after{
	  content: "";
  display: inline-block;
  width: 12px; /* スマホで見た時の幅 */
  height: 12px; /* スマホで見た時の高さ */
  background: url(https://www.rakuten.ne.jp/gold/styleformom/pc/img/btn/right.png) no-repeat;
  background-size: contain;
  margin-right: 3px;
	position: absolute;
	right:5px;
	top:40px;
}








/* 企画リスト */
.fw_kikaku{padding: 2rem 0;}

.fw_kikaku li{margin-bottom: 1rem;}






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



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

/* /////// NEW 戻る追従ボタン /////// */
#return{
 position:fixed;
bottom: 10px;
 right:10px;
 z-index:999;
	width:50px;
}
	



#return .return_button{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-ms-flex-line-pack: center;
	    align-content: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	font-size: 10px;
	padding: 0;
	color: #fff;
	background-color: #222;
	width: 55px;
	height: 55px;
	border-radius: 8px;
}



#return .return_button .img{
	width: 30px;
	font-size: 0;
	height: auto;
}

#return .return_button .text{
	width: 100%;
}




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