/*　上部ナビ　*/
#nav_icon {
    z-index: 999 !important;
    visibility: hidden;
}


/*　contents　*/
#contents{
    margin: -57px auto 0;
	text-align: center;
	max-width: 720px;
}


#contents #nyugaku * {
    font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 16px;
    letter-spacing: 0.15em;
    line-height: 1.8em;
}

/*　max-width:480px　*/
@media screen and (max-width:480px) { 

/*　画面サイズが480px以下はここを読み込む　*/


.drawer--left .drawer-nav {
    left: -22rem;
}

.drawer-nav {
    width: 22rem;
}

.drawer-nav{
    width: 22rem;
}


#nav_icon {
    z-index: 999 !important;
    visibility: visible;
}


#contents{
    margin: 0 auto;
}

}

/*　↑max-width:480px↑　*/




/*　スライド　*/

#contents div#topsl {
    margin-bottom: -25px;
    position: relative;
}


/*　↓トップ↓　*/
#contents .ttitle {
    top: 92%;
    position: absolute;
    z-index: 1;
}


#contents p.toptxt {
    margin-bottom: 18%;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/
}



#contents .toparea {
    margin: 70% 5% 0 5%;
    text-align: left;
}



/*　↓トップメニューボタン↓　*/

#contents #nyuenmenu {
    margin-bottom: 10%;
}


#contents #nyuenmenu ul {
    overflow: hidden;
    list-style: none;
    margin: 5% 0 0 0;
    padding-bottom: 10%;
}
#contents #nyuenmenu ul li {
    float: left;
    width: 32%;
    margin: 0;
    text-align: center;
}
#contents #nyuenmenu ul li.lt{
    margin: 2% 1% 1% 0;
}
#contents #nyuenmenu ul li.ct{
    margin: 2% 0 1% 0;
}
#contents #nyuenmenu ul li.rt{
    margin: 2% 0 1% 1%;
}


#contents #nyuenmenu .searchi{
    margin: auto;
    display: block;
}


/* ↓トップメニューテキスト↓ */


#contents #nms img{
    margin: 1% 0;
}

/* ↑メニュー↑ */


/*　混雑　*/
#konzatsu {
    clear:both;
    text-align: left;
    margin: 0 2.5% 10% 2.5%;
}


#konzatsu span{
    margin: 15% 1% 0 2%;
    color: #cbb393;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/
}

#konzatsu p{
    margin: 1% 0;
    padding: 1% 3%;
    color: #FFFFFF;
    font-size: clamp(0.813rem, -0.074rem + 3.64vw, 1.563rem) !important; /*　min 13 px max 25 px VP：min 390 max720　*/
    background-color: #e1c7a3;
    border-radius: 9999px;
    letter-spacing: 0.12em !important;
}



/*　ランキング　*/

#contents .ranking{
    margin: 0 0 18% 0;
}

#contents .reci{
    text-align: left;
    margin: 0 5% 20% 5%;
}

#contents .reci .iname {
    padding-left: 10%;
    margin: 5% 0 2%;
      font-size: clamp(1.25rem, 0.511rem + 3.03vw, 1.875rem) !important; /*　min 20 px max 30 px VP：min 390 max720　*/
    line-height: 1.4em !important;
    font-weight: 600;
}


#contents .reci img.no {
    float: left;
    width: 9%;
    margin-left: -2px;
    margin-top: 5%;
}

#contents .reci .ti {
    margin-bottom:15px;
}

.reci .slc {
    margin: 5px 0 15px;
}

#contents .reci .sent {
    clear: both;
    padding: 5% 0 5% 0;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/

}

#contents .reci .mitem{
    margin-bottom: 12%;
    display: block;
    font-size: clamp(0.813rem, -0.074rem + 3.64vw, 1.563rem) !important; /*　min 13 px max 25 px VP：min 390 max720　*/
    letter-spacing: 0em !important;
}

#contents .reci .mitem span {
    background: #f8f8f8;
    border-radius: 30px;
    padding: 2px 7px;
    margin: 2px 4px 2px 0;
    display: inline-block;
    font-size: clamp(0.813rem, -0.074rem + 3.64vw, 1.563rem) !important; /*　min 13 px max 25 px VP：min 390 max720　*/
    letter-spacing: 0em !important;
}




#contents .ritem{
    margin:0 4% 5%;

}

#contents .ritem h4{
    text-align: left;
	text-indent: 1rem;
    padding: 20px 0 20px;


}


#contents .ritem ul {
    margin: 10% 0;
}

#contents .ritem li {
    display: inline-block;
    width: 47.5%;
    margin: 0 0.5% 12px;
    vertical-align: top;
    position: relative;
}

#contents .ritem li a{
    text-align:left;
    display: block;
    padding-bottom: 8px;
    font-size: clamp(0.813rem, -0.074rem + 3.64vw, 1.563rem) !important; /*　min 13 px max 25 px VP：min 390 max720　*/


}

#contents .ritem li a span {
    color: #e57878;
    display: block;
	
}

#contents .ritem li a img {
    text-align: center;
    display: block;
    margin: 0 auto;
    padding-bottom: 5px;
}

#contents .ritem li div {
    position: absolute;
    right: 0;
    width: 22%;
    padding: 76% 1%;
    opacity: 0.9;
}

#contents .rank-button a:link, .rank-button a:visited, .rank-button a:active {
    margin: 7% 0;
    padding: 2.2% 4%;
    display: block;
    background: #c1d5d0;
    color: #fff;
      font-size: clamp(1.25rem, 0.511rem + 3.03vw, 1.875rem) !important; /*　min 20 px max 30 px VP：min 390 max720　*/
    letter-spacing: 0.18em !important;
}

#contents .midashi-button a:link, .midashi-button a:visited, .midashi-button a:active {
    margin: 0 2%;
    padding: 2.2% 4%;
    display: block;
    background: #cfc6bc;
    text-align: left;
    color: #fff;
      font-size: clamp(1.25rem, 0.511rem + 3.03vw, 1.875rem) !important; /*　min 20 px max 30 px VP：min 390 max720　*/
    letter-spacing: 0.18em !important;
}


/*　フェードアクション　*/
#contents .scfade {
    opacity: 0;
    transform: translatey(10px);
    transition: all 1.5s;
}

/*　↑ここまで2020追加↑　*/


img.topi {
    margin-bottom: 5%;
}



#contents .cont {
    margin: 15% 0 15% 0;
}

#nyugaku_item{
    margin-bottom: 10%;
}

#contents .conttop {
    margin: 0 5% 10% 5%;
}

#contents p.conttl {
    position: relative;
    padding: 20px 3%;
    margin: 0 0 20px 5px;
    border-left: solid 8px #ccc;
    text-align: left;
}

#contents .conttop img {
    margin-bottom: 25px;
}


#contents p.conttxt{
    margin: 5% 0 18% 0;
    padding: 0;
    text-align:left;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/
}


/* ↓カット生地↓ */

#contents .kijisyurui {
    background-color: #f7f7f7;
	padding: 5% 0 14%;
}

#contents .kijiexp {
    text-align: left;
    margin: 7% 5% 10%;
}


#contents .markup {
    margin-bottom: 2%;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/
    font-weight: 600;

}


#contents .kijiexp .item{
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/

}


#contents .kijith {
    margin: 0 2.7% 10% !important;
}

#contents .kijith a img {
    margin: 1.5% 0.5%;
    width: 46.5%;
}



#contents .kijilink a:link, .kijilink a:visited, .kijilink a:active {
    margin: 0 4%;
    padding: 2.2% 4%;
    display: block;
    background: #cfc6bc;
    text-align: left;
    color: #fff;
      font-size: clamp(1.25rem, 0.511rem + 3.03vw, 1.875rem) !important; /*　min 20 px max 30 px VP：min 390 max720　*/
    letter-spacing: 0.18em !important;
}

/* ↑カット生地↑ */



/* ↓男女おすすめ生地↓ */

#contents .ranking .search {
    margin: 5% 4% 12%;
}


#contents span.sagasu {
    margin: 3% 0 5%;
    display: block;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/


}


#contents .selectgara {
    margin-bottom: 45px;
}

#contents .selectgara a img {
    margin: 5px 0.5% 10px;
}


#contents .selectcolor {
    list-style: none;
    margin-bottom: 40px;
}


#contents .selectcolor li {
    border-radius: 5%;
    text-decoration: none;
    width: 30%;
    display: inline-block;
    margin: 2% 0.5%;
    padding: 8% 0;
}


#contents .selectcolor a li{
    color: #fff;
}


#contents .selectcolor .pink {
    background-color: #e5c5c8;
}

#contents .selectcolor .purple {
    background-color: #d1bdd5;
}

#contents .selectcolor .red {
    background-color: #d79090;
}

#contents .selectcolor .skyblue {
    background-color: #9bc0d3;
}

#contents .selectcolor .blue {
    background-color: #8dafcf;
}

#contents .selectcolor .green {
    background-color: #9ec1aa;
}

#contents .selectcolor .yellow {
    background-color: #e5d9a6;
}

#contents .selectcolor .orange {
    background-color: #e1bd99;
}

#contents .selectcolor .brown {
    background-color: #af9989;
}

#contents .selectcolor .navy {
    background-color: #5a637c;
}

#contents .selectcolor .gray {
    background-color: #aba7a7;
}

#contents .selectcolor .muji {
    background-color: #c9c9c9;
}

/* ↓男女おすすめ生地th↓ */

#contents .bwth{
	width:95%;
	text-align: left;
	margin:0 auto;
	padding:0;
	margin-bottom:30px;
}

#contents .bwth li {
	width:47%;
	margin:10px 1%;
	box-sizing: border-box;
	list-style:none;
	display:inline-block; 
	  /display:inline; 
	  /zoom:1;
	vertical-align: top; 
}

#contents .rect div { 
	display: block;
	overflow:hidden;
	position:relative;
}

#contents .rect div img { 
	max-width:140%;
	min-width:100%;
	width:auto;
	min-height:100%;
	max-height:140%;
	height:auto;
	position:absolute;
	top:-40%;
	right:-40%;
	bottom:-40%;
	left:-40%;
	margin:auto;
}

#contents .bwth p {
	margin-top: 10px;
}




/* ↓グッズ別↓ */
#contents .contsub {
    padding: 0 5%;
    margin: 10% 0;
}

#contents .contsub img {
    margin-bottom: 10px;
}

#contents h3.komidashi {
    padding: .5em;
    border-left: double #ccc;
    margin: 0 0 1em 0;
    text-align: left;
      font-size: clamp(1.25rem, 0.511rem + 3.03vw, 1.875rem) !important; /*　min 20 px max 30 px VP：min 390 max720　*/
    letter-spacing: 0.12em !important;

}

#contents .contsub a p {
    margin: 20px 0 5px 0;
    color: #789eb7;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/
}

#contents p.contsubtxt{
    text-align:left;
    padding: 6% 0 7%;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/

}


#contents .osusume{
	text-align:left;
}

#contents .osusume img {
    margin-bottom: 20px;
}

#contents p.ositem{
    margin-bottom: 6px;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/
}

#contents p.ositemlink a:link, #contents p.ositemlink a:visited, #contents p.ositemlink a:active {
    color: #789eb7;
    font-size: clamp(1.125rem, 0.608rem + 2.12vw, 1.563rem) !important; /*　min 18 px max 25 px VP：min 390 max720　*/

}


/* ↓副資材↓ */
#contents .selectfuku {
    padding: 3%;
}

#contents .selectfuku a img {
    margin: 1.3% 0.3%;
}


/* ↓menuボタン↓ */

#contents #backnavi {
    position: fixed;
    bottom: 20px;
    right: 10px;
    z-index: 100;
}

#contents #backnavi a {
    text-decoration: none;
    width: 72px;
    height: 72px;
    display: block;
    text-indent: -99999px;
    background-image: url(https://www.rakuten.ne.jp/gold/decollections/images/nyugaku/2023/nyuenmenu.gif);
    background-repeat: no-repeat;
    background-size: 70px;
    opacity: 0.8;
    filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.4));
}



/* ↓pickup↓ */

#contents div.pick {
    background: #f4eee7;
}