@media print, screen and (min-width: 640px) {

/********************************************** ■Q&A */	

.qa1{
	background-image:url(../images/qa/q.gif);
	background-repeat:no-repeat;
	font-size:14px;
	font-weight:bold;
	padding: 0 20px 0 50px;
	line-height:50px;
	border:1px solid #888888;
	border-bottom:1px dashed #888888;
	
	}
	
.qa2{
	background-image:url(../images/qa/a.gif);
	background-repeat:no-repeat;
	font-size:14px;
	padding: 15px 20px 20px 50px;
	margin-bottom:30px;
	border:1px solid #888888;
	border-top:none;
	}	
	
	
/********************************************** ■納期 */	
	
.noki ul{
	padding:0px;
	margin:0px;
	}
	
.noki li{
	margin-bottom:15px;
	font-size:15px;
	}		
	
	
.hassou{margin-left:20px;
	margin-bottom:40px;
	margin-right:5px;
	font-size:12px;
	}

.hassou table{
	border-top:1px #CCCCCC solid;
	border-right:1px #CCCCCC solid;
	}	
	
	
.hassou td{
	padding:5px;
	border-bottom:1px #CCCCCC solid;
	border-left:1px #CCCCCC solid;
	
	}	
	
.hassou th{
	padding:5px;
	border-bottom:1px #CCCCCC solid;
	border-left:1px #CCCCCC solid;
	background-color:#EAEAEA;
	
	}		
	
	
/********************************************** ■データ入稿 */		
	
	
.left table {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #CCC;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	border-left-color: #CCC;
	margin-top:15px;
	margin-bottom:15px;
}
.left td {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #CCC;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	border-left-color: #CCC;
	padding: 5px;
	font-size:14px;
}
.blue {
	background-color: #E8EFFF;
}


.left50 {
	float: left;
	text-align: center;
}
.right50 {
	float: left;
	text-align: center;
}	
	
	
.date1{
	border:1px solid #000000;
	padding:5px;
	font-size:14px;
	background-color:#000000;
	color:#FFFFFF;
	font-weight:bold;
	border-bottom:none;
	margin:20px 0px 0px 0px;
	}	
	
	
.date2{
	border:1px solid #000000;
	border-top:none;
	padding:10px;
	margin:0px;
	font-size:12px;
	}
	
	
.date3{
	padding:5px;
	font-size:12px;
	background-color:#CCCCCC;
	color:#000000;
	font-weight:bold;
	border-bottom:none;
	margin:20px 0px 10px 0px;
	}	
	
	
.date4{
	margin:15px 0px 15px 0px;
	text-align:center;
	}		

/********************************************** ■価格表 */	


.kakaku table{ margin:20px auto; width:90%;}
	
	

	
.kakaku_white{
	background-color:#FFFFFF;
	}
		
	
    
	
.kakaku2 table{
	margin-top:10px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	}		 
	 

	
.kakaku3{
	background-color:#f3f3f3;
	}	


.kakaku4{
	border:#666666 1px solid;
	border-left:#666666 390px solid;
	padding-right:10px;
	margin-bottom:20px;
	line-height:30px;
	font-size:14px;
	text-align:right;
	font-weight:bold;
	}


.kakaku5{
	background-color:#ffffff;
	}	


.kakaku6{
	background-color:#FFC;
	}




/********************************************** ■カテゴリトップ */		


.tuzuki{
	padding:10px;
	font-size:20px;
	margin:10px 4px 10px 2px;
	text-align:center;
	clear:both;
	background-color:#ff51ba;
	font-weight:bold;
	
	}
	
.tuzuki a:link{
	color:#FFF;
	text-decoration:none;
	display: block;}

.tatamu{
	padding:3px;
	font-size:12px;
	margin:10px 4px 10px 2px;
	text-align:center;
	clear:both;
	}	


/********************************************** ■各商品ページ　画像ライン枠設定 */			


.kosei{border:3px solid #F00;
	font-size:14px;
	font-weight:bold;
	padding:5px;
	color:#F00;
	margin-bottom:5px;}
	
.kosei2{
	background:#000;
	
	font-size:14px;
	font-weight:bold;
	padding:5px;
	color:#Fff;
	margin-bottom:5px;}	
	

.line4a{
	border:1px solid #999999;
	margin-right:10px;
	}
		
.linea{
	border:1px solid #999999;
	margin-bottom:20px;
	margin-top:10px;
	margin-right:10px;
	}
	
.linen{
	border:none;
	margin-bottom:20px;
	margin-top:10px;
	margin-right:10px;
	}

.linen2{
	border:none;
	margin-top:10px;
	margin-right:10px;
	}
	
	
.linec{
	border:1px solid #999999;
	}	
	
	
.coment{
	width:395px;
	border: medium double #999999;
	padding:10px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;	
	}	
	
	
.coment2{
	padding:7px;
	margin-left:auto;
	margin-top:7px;
	margin-right:10px;
	border:1px solid #999999;
	}	



.pagelist{
	clear:both;
	padding-top:10px;}

.pagelist ul.nav {
	margin: 0 0 10px;
	padding: 10px 10px 5px;
	background: #eee;
	text-align: center;
}

.pagelist ul.nav li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}

.pagelist ul.nav li span{
	display: inline-block;
	margin-bottom: 5px;
	padding: 1px 8px;
	background: #555555;
	border: 0px solid #aaa;
	text-decoration: none;
	vertical-align: middle;
	color: #ffffff;
}

.pagelist ul.nav li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 1px 8px;
	background: #fff;
	border: 1px solid #aaa;
	text-decoration: none;
	vertical-align: middle;
}

.pagelist ul.nav li a:hover {
	background: #eeeff7;
	border-color: #00f;
}



/********************************************** ■ご注文方法 */	 

#order1{
	margin:1em; 
	
	}

#order1 table{
	font-size:14px;
	padding:0px 0px 0px 0px;
	margin:20px 0px 0px 0px;
	}
	
#order1 table td{
	padding:10px 10px 10px 10px;
	vertical-align: top;
	text-align:left;
	border-bottom:1px dashed #333333;
	}	
	



	
	
	
#order2{
	font-size:12px;
	float:left;
	}

#order2 table{
	font-size:12px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
	width:100%;
	background:url(../images/base/dotted.gif) repeat-x left top;
	}
	
	
	
#order2 table td{
	padding:10px 20px 10px 20px;
	margin-bottom:10px;
	vertical-align: top;
	text-align:left;
	background:url(../images/base/line-bg-dotted.gif) repeat-x left bottom;
	margin:10px 0px 4px 0px;

	}	
	
#order2 table th{
	padding:10px 20px 10px 20px;
	margin-bottom:10px;
	vertical-align: top;
	background:url(../images/base/line-bg-dotted.gif) repeat-x left bottom;
	margin:10px 0px 4px 0px;
	text-align:left;
	background-color:#E7E7E7;
	color:#333333;
	width:30%;
	}
	
.orderfc{font-size:16px;
	padding:7px;
	font-weight:bold;
	background-color:#cccccc;
	border-top:5px solid #666666;}	
	
.dotline{
	border-bottom:1px solid #999999;}	

.sample_atena{
	margin:10px;
	text-align:center;
	}
	
	
#guide{
	border-top:solid 1px #CCCCCC;
	padding-top:10px;
	padding-bottom:10px;
	}	
	
#guide table{
	padding-left:10px;

	}	
	
#guide .line{
	border-right:#CCCCCC solid 1px;}	
	
#guide td{
	padding:1em;
	width:33%;
	}	
	
.guidetitle{ background:#7e7e7e; padding:0.2em 0.2em 0.5em; font-size:14px; font-weight:bold; color:white; margin-bottom:0.75em;}	

.txtalignleft{text-align:left;}	
	
	
#guide2{
	float:left;
	margin-top:100px;
	margin-bottom:50px;}
	
#guide2 table{
	width:655px;
	border-width: 1px;
	border-style: solid;
	border-color: #CCCCCC;
	border-top:solid 10px #999999;

	}	
	
#guide2 .line{
	border-right:#CCCCCC solid 1px;}	
	
#guide2 td{
	padding:10px;
	width:33%;
	}	
	
	
.guide_title2 {
	display: block;
	height: 25px;
	line-height: 25px;
	font-size: 14px;
	font-weight: bold;
	text-indent: 10px;
	margin-top:30px;
	border:1px #000000 solid;
	border-left:10px #000000 solid;
	
}	
	
	
	
#orderform{}

.lh150{line-height:150%;}

.syohinh2{ border:2px solid pink; border-left:none; border-right:none; padding:1% 0;}


#orderform .egaraimg{float:left; overflow:hidden; padding:1% 2% 0 1%; text-align:center;}

#orderform .egaratxt{float:left; overflow:hidden; padding-top:1%; width:100%; }


#orderform .title{padding:10px; background:#595959; border:1px solid #999999; font-size:16px; font-weight:bold; color:#ffffff;}

#orderform .naiyo{padding:10px; background:#ffffff; border:1px solid #999999; border-top:none; margin-bottom:30px; overflow:hidden;}

#orderform .bun{background:#ececd4; margin:0; font-size: small; line-height:150%; padding:1.5%;}



.box41{width:25%; float:left; text-align:center;}

.box42{width:25%; float:left; text-align:center;}

.box43{width:25%; float:left; text-align:center;}

.box44{width:25%; float:left; text-align:center;}



.box31{width:33.3333%; float:left; text-align:center;}

.box32{width:33.3333%; float:left; text-align:center;}

.box33{width:33.3333%; float:left; text-align:center;}


.txtleft{text-align:left;}






#orderform2{border:1px solid #666666;}


#orderform2 table{
	
	padding:5px;
	}
	

	
#orderform2 table th{
	background:#fce4df;
	}

.dodline{border-bottom: 1px dotted #999999;}

.pinkline{border-left:7px solid #ff51ba;}




	
	
.imageCover1 {
    position: relative;
    width: 130px;
}

.imageCover1 .baseImage {
    width: 130px;
}

.imageCover1 .coverImage {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 130px;
}




.imageCover2 {
    position: relative;
    width: 130px;
    height: 88px;
}

.imageCover2 .baseImage {
    width: 130px;
    height: 88px;
}

.imageCover2 .coverImage {
    position: absolute;
    right: 0;
    bottom: 0;
}



.mojiari{
	text-align:left;
	padding:3px;
	background:#cccccc;
	width:130px;
	margin-left:auto;
	margin-right:auto;}

	
	
.box1{}	
	
div.box1:hover {
background-color: #fffed2;/*カーソルが来た時の背景の色*/
}	


.box2{
	padding:1px;}	
	
div.box2:hover {
background-color: #fffed2;/*カーソルが来た時の背景の色*/
}	


.back_a{
	background-color:#efefe4;
	padding:15px;
	border-radius:7px;
	margin:10px;
	border:1px solid #666666;}
	
	
.meiryo{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}

.kugiri{
	border-top:1px dotted #000;}  
	
.kugiri2{
	border-right:10px solid #ffffff;}  	

.pinkobi{

background-color:#ec6d81; 
color:#fff;
text-align:center;
padding:3px;
font-size:14px;
}
	
	
.pinkobi2{

background-color:#ec6d81; 
color:#fff;
text-align:center;
padding:3px;
font-size:14px;
}
		
.konna{
	border:1px solid #c8c5c4;
	background:#FFF;
	padding:5px;
	margin:0 0 10px 0;}

.dor{ border:1px solid #cccccc;}
	
	
/********************************************** ■プライバシーポリシー */	 		
		
#policy1{
	margin-top:10px;
	float:left;
	font-size:14px;
	}

#policy1 table{
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
	}
	
	
	
#policy1 table td{
	padding:1% 1% 3% 1%;
	margin-bottom:10px;
	vertical-align: top;
	text-align:left;
	}	
	
#policy1 table th{
	padding:1%;
	margin-bottom:10px;
	vertical-align: top;
	text-align:left;
	background-color:#E7E7E7;
	color:#333333;
	width:30%;
	}		
	
	
	
/********************************************** ■データ入稿 */	
	
	
	
	
.kakaku_glay{
	background-color:#EFEFEF;
	}
	
	
.kakaku_yellow{
	background-color:#FFFFCC;
	}
	
	
	
.soft{padding:0; margin:0;}

.soft table{
	width:100%;
	padding:0; margin:0;
	}
	
.soft th{
	text-align:center;
	font-size:12px;
	font-weight:bold;
	background-color:#CCCCCC;
	margin:0;
	padding:0;
	border-bottom:1px #ffffff solid;
	}
	
	
.soft td{
	border-bottom:1px #999999 dotted;
	text-align:center;
	font-size:12px;
	margin:0;
	padding:0;
	}	
	
	
.order1{
	border:1px solid #666666;
	border-left:10px solid #666666;
	padding:10px;
	font-size:16px;
	margin-bottom:30px;
	margin-top:30px;
	font-weight:bold;
	}	
	
.order2{
	padding:5px;
	font-size:14px;
	margin-bottom:10px;
	margin-top:0px;
	font-weight:bold;
	background-color:#CCCCCC;
	}
	
.order3{
	border:1px solid #CCCCCC;
	}			
	
	
	
	table.company {
    width: 500px;
    margin: 0 auto 50px auto;
    border-collapse: separate;
    border-spacing: 0px 15px;
    font-size: 12px;
}




table.company{
	width:98%;}
 
table.company th,
table.company td {
    padding: 10px;
}
 
table.company th {
    background: #295890;
    vertical-align: middle;
    text-align: left;
    overflow: visible;
    position: relative;
    color: #fff;
    font-weight: normal;
    font-size: 15px;
}
 
table.company th:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #295890;
    border-width: 10px;
    margin-top: -10px;
}
/* firefox */
@-moz-document url-prefix() {
    table.company th::after {
        float: right;
        padding: 0;
        left: 30px;
        top: 10px;
        content: " ";
        height: 0;
        width: 0;
        position: relative;
        pointer-events: none;
        border: 10px solid transparent;
        border-left: #295890 10px solid;
        margin-top: -10px;
    }
}
 
table.company td {
    background: #f8f8f8;
	font-size:14px;
    padding-left: 20px;
}



.orderbtn{
	
	
	
	
	
	font-size:24px;
	
	width:98%;	
	
	margin:50px auto;
	
	
	box-shadow: 3px 3px 3px rgba(0,0,0,0.4); 
	
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */
	




background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #fdfdfd), color-stop(0.74, #e7e8e8), color-stop(0.44, #c7c8ca), color-stop(0.22, #f1f1f1), color-stop(0.00, #d8dada));
background: -webkit-linear-gradient(top, #d8dada 0%, #f1f1f1 22%, #c7c8ca 44%, #e7e8e8 74%, #fdfdfd 100%);
background: -moz-linear-gradient(top, #d8dada 0%, #f1f1f1 22%, #c7c8ca 44%, #e7e8e8 74%, #fdfdfd 100%);
background: -o-linear-gradient(top, #d8dada 0%, #f1f1f1 22%, #c7c8ca 44%, #e7e8e8 74%, #fdfdfd 100%);
background: -ms-linear-gradient(top, #d8dada 0%, #f1f1f1 22%, #c7c8ca 44%, #e7e8e8 74%, #fdfdfd 100%);
background: linear-gradient(top, #d8dada 0%, #f1f1f1 22%, #c7c8ca 44%, #e7e8e8 74%, #fdfdfd 100%);

}


.orderbtn a{
	text-decoration:none;display:block;
	
	color:#000;
	
	
	padding:15px 10px;
	
	}



.detasetsu{}


.detasetsu dl{
	width:100%;
	margin:0 auto 50px auto;}

.detasetsu dt{
	font-weight:bold;
	font-size:16px;
	color:#000;
	
	border:1px solid #414141;
	border-bottom:none;
	background:#fffabf;
	margin: 0;
	padding:10px;
 
    -webkit-border-top-right-radius: 7px;  
    -webkit-border-top-left-radius: 7px;
	  
    -moz-border-radius-topright: 7px;  
    -moz-border-radius-topleft: 7px; 
	
	
	}

.detasetsu dd{
	border:1px solid #414141;
	border-top:1px dotted #666666;
	margin:0 0 30px 0;
	padding:13px;
 
    -webkit-border-bottom-right-radius: 7px;  
    -webkit-border-bottom-left-radius: 7px;
	  
    -moz-border-radius-bottomright: 7px;  
    -moz-border-radius-bottomleft: 7px;  }

	
#detabtn{
	text-align:center
	}


#detabtn ul{
	list-style:none;
	padding:0;
	margin:0 auto;
	width:95%;
	overflow: auto;
	}


#detabtn ul li a:link{
	font-size:18px;
	text-align:center;
	float:left;
	display:block;
	background:#ff7094;
	margin:0 2% 0px 0;
	padding:2%;
	width:27%;
	text-decoration:none;
	color:#000000;
	
	box-shadow: 3px 3px 3px 3px #eeeeee;
 
    border-radius: 7px;        /* CSS3草案 */  
    -webkit-border-radius: 7px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 7px;   /* Firefox用 */ }
	
#detabtn ul li a:hover{color:#ffffff;}	
	

#detabtn ul li:last-child{
	margin:0}
	
	
/********************************************** ■リンク */		




.sogo01{}


.sogo01 dl{}

.sogo01 dt{margin:0px 0px 0px 0px;
	padding:0px 10px 0px 10px;}

.sogo01 dd{
	margin:0px 0px 20px 0px;
	padding:5px 10px 10px 20px;
	display:block;
	background-image: url(../images/base/dotted.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
}




/********************************************** ■残暑見舞い */		



#syotyu01{
	margin-bottom:50px;
}


#syotyu01 div:nth-child(odd){
	float:left;
	text-align:center;
	padding-bottom:10px;
	background-color: #8ddcdd;
	width:25%;
	border-bottom:1px solid #ffffff;
	}

#syotyu01 div:nth-child(even){
	float:left;
	text-align:center;
	padding-bottom:10px;
	background-color: #e9f2f2;
	width:25%;
	border-bottom:1px solid #ffffff;}


#syotyu01 .title{
	font-size:18px;
	padding:7px;}




#syotyu01 .catch{
	font-size:small;
		line-height:16px;
		padding:3px;
}


#syotyu01 a:link {color: #000;
	text-decoration:none;}




	
	
	
	
	
#zansyo01{
	margin-bottom:50px;
}


#zansyo01 div:nth-child(odd){
	float:left;
	text-align:center;
	padding-bottom:10px;
	background-color: #93c5ff;
	width:25%;
	border-bottom:1px solid #ffffff;
	}

#zansyo01 div:nth-child(even){
	float:left;
	text-align:center;
	padding-bottom:10px;
	background-color: #e7f2ff;
	width:25%;
	border-bottom:1px solid #ffffff;}


#zansyo01 .title{
	font-size:18px;
	padding:7px;}




#zansyo01 .catch{
	font-size:small;
		line-height:16px;
		padding:3px;
}


#zansyo01 a:link {color: #000;
	text-decoration:none;}
	
	
	
	
	

		
/********************************************** ■ご注文方法 */


.orderline{
	background-image:url(../images/base/dotted.gif);
	background-repeat:repeat-x;
	}
				
		
	
	
.vertical-align input,
.vertical-align select{
    vertical-align:-0.2em;
}	





#next{
	text-align:center;
	margin:20px 0 20px 0;
	clear:both;}


#next span{
	
	
}

#next span a:link {
	color:#ffffff;
	text-decoration:none;
	background:#000000;
	padding:7px 10px;
	margin:5px;
	font-size:14px;
	font-weight:bold;
	border-radius: 5px;  

} 

#next span a:visited{color:#ffffff;}

#next span a:hover {
	color:pink;
	text-decoration:underline;

} 



.blackwaku4{
		border:1px solid #999;
		padding:7px;
		margin-top:50px;
		margin-left:10px;
		margin-right:10px;
		background:#f4f4f2;
		}	











.hyoji-2-left{
  float: left;
  width: 50%;
}
.hyoji-2-right{
  float: left;
  width: 50%;
}


.cate-kyotu{border-top:1px dashed #000000;border-bottom:1px dashed #000000;}

.cate-kyotu .left{border-right:1px dashed #c3c3c3;}




/*リピート割引*/

.repeat img{
	max-width:100%;
	height:auto;
}

.repeat table{
    border-collapse: collapse;
    text-align: center;
    font-size: 16px;
    width: 50%;
    table-layout: fixed;
}

.repeat td{
    height: 2em;
	border-bottom:1px solid #666666;
}

.repeat thead{
    background-color: #b2ccff;
    font-weight: bolder;
}

.repeat .info{
    background-color: #fffbdf;
    border-radius: 10px;
    padding: 10px;
    font-weight: bold;
    margin-bottom: 15px;
}

.repeat .info p{
    margin: 10px;
    color: #FF0000;
    font-size: 16px;
}

.bold_red{
    font-weight: bold;
    color: red;
}

.px16{
    font-size: 16px;
}





.kakakukougo table{
    border-top:1px solid #999999;
    border-left: 1px solid #999999;
    border-collapse:collapse;
}
.kakakukougo table th{
    border-right:1px solid #999999;
    border-bottom: 1px solid #999999;
    background: #ffc;
    text-align: center}
    
.kakakukougo table td{
    border-right:1px solid #999999;
    border-bottom: 1px solid #999999;
    text-align: center}    

    
.kakakukougo tr:nth-child(odd){background-color:#ffffff;}    

	
.kakakukougo tr:nth-child(even){background-color:#EFEFEF;}   




.datat{}

.datat table{
	border:1px #999999 solid;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	}
	
.datat th{
	border:1px #999999 dotted;
	text-align:center;
	font-size:14px;
	padding:10px;
	font-weight:bold;
    background: #ffc
	}	
	
	
.datat td{
	border:1px #999999 dotted;
	text-align:center;
	font-size:14px;
	padding:10px;
	width:25%;
	}	
    
.datat tr:nth-child(odd){background-color:#ffffff;}    

	
.datat tr:nth-child(even){background-color:#EFEFEF;}       






.enkaku{}

.enkaku table{
	border:1px #999999 solid;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	}
	

	
	
.enkaku td{
	border:1px #999999 dotted;
	text-align:left;
	font-size:14px;
	padding:10px
	}	
    
.enkaku td:nth-child(even){background-color:#ffffff;}    

	
.enkaku td:nth-child(odd){background-color:#ffc; white-space: nowrap}       






#main .px14.mb20 .highlight-link {
}

#popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#popup img {
  max-width: 90%;
  max-height: 90%;
}

/* ×ボタン */
#popup-close {
  position: absolute;
  top: 20px;
  right: 30px;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
}
.img-hover {
  transition: 0.3s;
  border: 1px solid transparent; /* 普段は見えない */
}

.img-hover:hover {
  opacity: 0.7;
  transform: scale(1.05);
  border-color: #ff6600; /* hover時だけ色出る */
  cursor: pointer;
}
.egara-wrap {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.egara-text {
  font-size: 14px;
  line-height: 1.8;
}
/* 商品一覧 */
.item-img {
  transition: 0.3s;
  transform-origin: center top;
}

.itiran2016 li:hover .item-img {
  transform: scale(1.1);
}

/* 注文ページ（単体画像） */
.egaraimg img {
  transition: 0.3s;
}

.egaraimg img:hover {
  transform: scale(1.05);
  opacity: 1.05;
}
.btn-cta{
  display:inline-block;
  color:#f2a65a;
  border:2px solid #f2a65a;
  padding:12px 20px;
  font-size:15px;
  font-weight:500;
  text-decoration:none;
  border-radius:6px;
  transition:all .25s ease;
  background:#fffafa;
}

.btn-cta:hover{
  background:#fff7ef;
  color:#d97a2b;
  border-color:#d97a2b;
  transform:none;
}
.tenrules-wrap {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  margin: 20px 0;
}

.tenrules-text {
  flex: 1;
}

.tenrules-img {
  flex: 0 0 220px;
}

.tenrules-img img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #eee; /* 軽く整える */
  border-radius: 4px;
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
  .tenrules-wrap {
    flex-direction: column;
  }

  .tenrules-img {
    width: 100%;
    flex: none;
  }
}
.tenrules-text p {
  margin-bottom: 10px;
}


.info-content {
  flex: 1;
}

.info-notes {
  width: 100%;
  margin-top: 10px;
}


.itiran2016 li{
  box-sizing:border-box;
}

.step{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}

.step-num{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #333;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  flex-shrink: 0;
}

.step-content{
  flex: 1;
  min-width: 0;
}

.step-title{
  font-weight: bold;
  margin: 0 0 6px 0;
  line-height: 1.4;
}

.step-text{
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}

.challenge-list{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.lineup-note{
  font-size: 14px;
  color: #666;
  margin: 0 0 8px;
  text-align: center;
  letter-spacing: 0.05em;
}
.tenrules-emphasis{
  font-weight:bold;
  font-size:1.05em;
}
/* 親要素のフレックスを縦方向に切り替える */
.tenrules-wrap {
    display: block; /* 左右分割をやめて、縦に積む設定に変更 */
    width: 100%;
}

/* 文章部分を横幅いっぱいに広げる */
.tenrules-wrap .tenrules-text {
    width: 100%;
    margin-bottom: 20px;
}

/* 3枚並びのスタイル（前回の設定を維持しつつ幅を確定） */
.tenrules-triple {
    display: flex;
    justify-content: space-between; /* 画像を端から端まで均等に */
    gap: 20px;
    width: 90%;
    margin-top: 30px;
}

.tenrules-triple img {
    width: 32%; /* 3枚が横いっぱいに広がるサイズ */
    height: auto;
    border: 0px solid #eee;
    border-radius: 4px;
}

/* スマホ対応：画像が小さくなりすぎる場合は縦並びに */
@media screen and (max-width: 640px) {
    .tenrules-triple {
        display: block; /* スマホでは縦に並べる */
    }
    .tenrules-triple img {
        width: 30%;
        margin-bottom: 20px;
    }
}
/* サンプル画像を横並び・中央寄せにする設定 */
.product-sample-container {
    display: flex;
    justify-content: center; /* 中央寄せ */
    gap: 20px;               /* 画像同士の隙間 */
    margin-bottom: 30px;
    flex-wrap: wrap;         /* スマホでは縦並びにする */
}

.sample-box {
    text-align: center;
    max-width: 320px;        /* 画像の最大幅を揃える */
    width: 100%;
}

.sample-box img {
    width: 100%;             /* ボックスの幅に合わせる */
    height: auto;
    display: block;
}

.sample-label {
    font-size: 12px;
    font-weight: bold;
    color: #666;
    margin-bottom: 5px;
}

/* スマホ用の調整 */
@media screen and (max-width: 640px) {
    .product-sample-container {
        gap: 10px;
    }
    .sample-box {
        max-width: 45%;      /* スマホで2つ並べたい場合は45% */
    }
}
/* オモテ面セクションのレイアウト調整 */
#orderform .egaraimg {
    text-align: left;    /* 中身を左寄せに */
    margin: 0 0 15px 0; /* 下にだけ余白を作る */
    padding: 0;          /* 余計なパディングをリセット */
}

#orderform .egaraimg img {
    display: block;      /* 隙間をなくすためブロック要素化 */
    margin-left: 0;      /* 左端を固定 */
    width: 113px;        /* ウラ面の画像サイズ（113px）と完全に一致させる */
    height: auto;
}

/* もし親要素に余白がついている場合の微調整 */
#orderform .naiyo {
    padding-left: 10px;  /* フォーム全体の左余白に合わせる（必要に応じて数値を調整） */
}
/* 注釈・補足用のスタイル */
.note-text {
  display: block;          /* ブロック要素にしてレイアウトを安定させる */
  font-size: 14px;         /* しっかり小さく（11〜12pxが一般的） */
  line-height: 1.6;        /* 行間を少し広げて読みやすく */
  color: #000000;          /* 濃いグレーにしてメイン文章と差別化 */
  margin-top: 20px;        /* 上の要素との余白 */
  letter-spacing: 0.02em;  /* わずかに文字間を広げる */
  font-weight: normal;     /* 細く設定 */
}

/* もし「※」だけ色を変えたい、などの場合はこちらも有効 */
.note-text span.mark {
  margin-right: 2px;
}/* 解説用の囲み枠スタイル */
.feature-box {
  margin: 30px 0;
  padding: 25px;
  border: 2px solid #333; /* 「blackwaku」の代わりの引き締まった枠線 */
  border-radius: 8px;      /* 角を少し丸くすると今風になります */
  background-color: #fff;  /* 背景を白にして読みやすく */
  text-align: center;      /* 全体を中央寄せ */
  line-height: 1.8;        /* 本文の行間をゆったりと */
}

/* 10か条のタイトル部分 */
.feature-box strong {
  font-size: 1.2rem;
  color: #000;
  display: block;          /* 改行を安定させる */
  margin-bottom: 10px;     /* 説明文との隙間 */
}

/* 注釈（先ほどのnote-textを活用） */
.feature-box .note-text {
  display: block;
  margin-top: 20px;        /* 上の説明文としっかり分ける */
  padding-top: 15px;
  border-top: 1px dashed #ccc; /* 本文と注釈の間に細い区切り線 */
  font-size: 11px;
  color: #777;
  line-height: 1.5;
}
/* 全体レイアウト */
.tenrules-section {
  max-width: 1000px; /* 少し広くして画像の逃げ道を作る */
  margin: 40px auto;
  padding: 0 15px;
  text-align: center;
  font-family: "Meiryo", sans-serif;
}

.tenrules-lead {
  font-size: 1.1rem;
  margin-bottom: 30px;
}

/* 画像エリア：PCでは3枚並び、スマホでは柔軟に */
.tenrules-visual {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 30px;
}

.img-card {
  flex: 1;
  max-width: 200px; /* これ以上大きくならない */
  min-width: 100px; /* これ以上小さくならない */
}

.img-card img {
  width: 100%;
  height: auto;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
  transition: transform 0.2s;
}

.img-card p {
  margin-top: 10px;
  font-weight: bold;
  color: #555;
  font-size: 14px;
}

/* 情報ボックス：白背景に薄い枠でスッキリ */
.tenrules-info-box {
  background: #fcfcfc;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 25px;
  max-width: 700px;
  margin: 0 auto;
}

.info-content {
  margin-bottom: 15px;
  line-height: 1.8;
}

.info-content strong {
  display: block;
  font-size: 1.1rem;
  margin-bottom: 5px;
}

.info-notes {
  font-size: 12px;
  color: #888;
  border-top: 1px solid #eee;
  padding-top: 10px;
}

/* スマホ対応：画面が狭くなったら2枚または1枚にする */
@media (max-width: 768px) {
  .tenrules-visual {
    flex-wrap: wrap;
  }
  .img-card {
    min-width: 45%; /* スマホでは2列にする */
  }
}
/* ===== 目的ナビ ===== */

.purpose-nav {
  background: #fafafa;
  padding: 25px;
  border-radius: 4px;
  margin: 30px 0;
  border: 1px solid #eee;
}

.purpose-title {
  text-align: center;
  margin-bottom: 20px;
  color: #666;
  font-size: 14px;
  letter-spacing: 0.1em;
}

.purpose-list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.purpose-list li {
  flex: 1;
  min-width: 240px;
}

/* ボタン共通 */
.purpose-btn {
  display: block;
  background: #fff;
  padding: 12px;
  text-align: center;
  text-decoration: none;
  border-radius: 3px;
  font-size: 14px;
  border: 1px solid;
}

.purpose-btn span {
  font-size: 11px;
  opacity: 0.8;
  display: block;
}

/* 色別 */
.purpose-btn.blue {
  border-color: #007bff;
  color: #007bff;
}

.purpose-btn.green {
  border-color: #28a745;
  color: #28a745;
}

.purpose-btn.gold {
  border-color: #d4a017;
  color: #d4a017;
}

.purpose-btn.red {
  border-color: #dc3545;
  color: #dc3545;
}

/* バナー */
.banner-link img {
  width: 100%;
  max-width: 100%;
  display: block;
  margin-top: 20px;
}



/* うっすら黒を重ねる */
.challenge-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.22); /* ←0.12 → 0.22 */
}

.challenge-inner {
  position: relative;
  display: block;
  text-decoration: none;
}

/* 画像は背景扱い */
.challenge-img img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  display: block;

  filter: brightness(1.2) contrast(1.1);
}

/* オーバーレイ（完全版・安定型） */
.challenge-overlay {
  position: absolute;
  inset: 0;
  padding: 16px 18px;

  display: flex;
  flex-direction: column;
  justify-content: center;

  /* かなり軽くする（これ重要） */
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.35),  /* ←0.35 → 0.55 */
    rgba(0,0,0,0.05)   /* ←0.05 → 0.15 */
  );

  z-index: 2;
}


/* 主役 */
.banner-title {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 700;
  font-size: 34px;
  color: #ffffff;
  text-shadow: 0 3px 10px rgba(0,0,0,0.7);
  line-height: 1.15;
  margin-bottom: 6px;
}

/* サブ（コピー） */
.banner-sub {
  color: #fff;
  text-shadow: 0 2px 6px rgba(0,0,0,0.7);
  line-height: 1.2;
  margin-bottom: 6px;
}

/* 説明 */
.banner-desc {
  font-size: 15px;
  color: rgba(255,255,255,0.9);
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
  line-height: 1.45;
  margin-bottom: 10px;
  max-width: 70%;
}

/* CTA（右下・終点） */
.banner-more {
  position: absolute;
  right: 18px;
  bottom: 14px;

  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 18px;
  font-weight: 700; /* ←重要 */
  letter-spacing: 0.08em;

  color: #fff;

  text-shadow: 0 2px 6px rgba(0,0,0,0.9);

  padding: 2px 6px;

  border-bottom: 2px solid rgba(255,255,255,0.75);
}

/* strongは“無効化せず整える” */
.banner-more strong {
  font-weight: inherit;
}






/* スマホ */
@media (max-width: 640px) {
  .challenge-inner {
    flex-direction: column;
    text-align: center;
  }

  .challenge-img img {
    width: 100%;
    margin-top: 10px;
  }
}
.tenrules-info-box {
  display: block !important;
}
/* ===== メインバナー ===== */
/* フル幅バナー */
.main-banner.full {
  background-image: url("../images/syotyu/main_01_2026.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;

  width: 100%;
  aspect-ratio: 1200 / 300;

  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
}


/* グレーは“画像領域だけ” */
.main-banner.full::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.0);
  z-index: 1;
}

/* フル幅バナー */
.main-banner.full2 {
    background-image: url(../images/index/main_03_2026.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    aspect-ratio: 1200 / 300;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
}


/* グレーは“画像領域だけ” */
.main-banner.full2::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.0);
  z-index: 1;
}
/* 中身 */
.banner-inner {
  position: relative;
  z-index: 2;

  width: 100%;
  max-width: 1000px;

  margin: 0 auto;
  padding: 40px 20px; /* ←ここが重要（余白） */
}
.banner-text a {
  text-decoration: none;
  color: #fff;
  cursor: default;
}

.banner-text .title {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.3;
}

.banner-text .sub {
  font-size: 20px;
}

.banner-text .desc {
  font-size: 18px;
  line-height: 1.2;
}
/* テキスト共通 */
.banner-text .sub,
.banner-text .title,
.banner-text .desc {
 font-family: "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
font-weight: 700;
letter-spacing: 0.03em;
text-shadow: 0 2px 2px rgba(0,0,0,0.9);

  /* フチは細くしないと潰れる */
}
.banner-text .title { color: #ff0; }
.banner-text .sub   { color: #ff0; }
.banner-text .desc  { color: #fff; }
.banner-text a,
.banner-text a:visited,
.banner-text a:hover,
.banner-text a:active {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

.banner-text a::after,
.banner-text a::before {
  display: none !important;
}
.main-banner.full,
.main-banner.full * {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}
.main-banner.full2,
.main-banner.full2 * {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

.banner-text .desc {
  text-align: right;
  margin-top: 10px;
  display: block;

  font-weight: 900;
  color: #fff;

  text-shadow:
    1px 1px 0 #000,
    -1px 1px 0 #000,
    1px -1px 0 #000,
    -1px -1px 0 #000,
    0 0 6px rgba(0,0,0,0.1);
}
.main-banner.full {
  transition: 0.3s ease;
}

.main-banner.full:hover {
  filter: brightness(0.9) sepia(0.1);
}
	.main-banner.full2 {
  transition: 0.3s ease;
}

.main-banner.full2:hover {
  filter: brightness(0.9) sepia(0.1);
}
.banner-text .sub {
  text-shadow:
    1px 1px 0 #000,
   -1px 1px 0 #000,
    1px -1px 0 #000,
   -1px -1px 0 #000;
}
.banner-text .title {
  text-shadow:
    1px 1px 0 #000,
   -1px 1px 0 #000,
    1px -1px 0 #000,
   -1px -1px 0 #000;
}
	.main-banner.full2 .banner-text .title,
.main-banner.full2 .banner-text .sub {
    color: #428EF5; /* 白に変更（落ち着く） */
}

.main-banner.full2 .banner-text .title,
.main-banner.full2 .banner-text .sub {
  text-shadow: 0 2px 1px rgba(0,0,0,0.2); /* 軽い影だけにする */
}
	.main-banner.full2 .banner-text .desc {
  color: rgba(255,255,255,0.9); /* 少し柔らかい白 */
  
  text-shadow: 0 2px 5px rgba(0,0,0,0.7); /* 軽い影だけ */
  
  font-weight: 600; /* ちょい軽くする（今900で強すぎ） */
}
	/* --- 既存レイアウトを壊さないための追加設定 --- */

/* 1. Float解除の徹底（全ページ共通の安全策） */
.itiran2016 ul::after,
.itiran2016::after {
    content: "";
    display: block;
    clear: both;
}

/* 2. スマホメニュー表示の安定化 */
@media screen and (max-width: 640px) {
    /* 既存の style_mobile.css を上書きして確実に表示させる */
    #c-menu--slide-right {
        display: block !important; /* スクリプトの動作を優先 */
        z-index: 10000;
    }
    
    /* 紹介セクションの横並び崩れ防止 */
    .konna {
        box-sizing: border-box; /* パディングによる幅広がりを防止 */
    }
}