@charset "utf-8";

/**********************************************************************　スマホ　*******************************************************************************/

body { margin: 0 }
.pc ,.sitemap,.anch
{display: none;}

/**********************************************************************　デザイン　*******************************************************************************/

.id-box { padding-top: 30px; }
.bgph { background-size: auto 100%; background-position: center center }

.item01.abso { width: 100%;position: relative }
.item02.abso { position: relative }

#cn .item01 img { width: 50%;height: auto; }
#ec .item01 img { width: 80%;height: auto; }
#cq .item01 img { width: 60%;height: auto; }
#rm .item01 img { width: 60%;height: auto; }
#bs .item01 img { width: 50%;height: auto;margin: 0 auto}

.item02 {  } .item02 img { width: 50%;height: auto; }
.item03 { width: 40%;margin-left: 60% } .item03 img { width: 100%;height: auto; }

.ph-copy { padding: 20px }
.tray { margin-bottom: 10px; width: 85% }

/**********************************************************************　画像サイズの調整　*******************************************************************************/

.p-wide-90p { width: 80%;margin-right: 15%;margin-left: 5% }
.p-wide-80p { width: 70%;margin-right: 23%;margin-left: 12% }
.p-wide-70p { width: 60%;margin-right: 33%;margin-left: 17% }

/**********************************************************************　背景写真ボックス　*******************************************************************************/

#photobg { background-size: 100% auto }

body#body08 #photobg { background-size: auto 100% }
body#body09 #photobg { background-size: auto 100% }


/**********************************************************************　タイポグラフィー　*******************************************************************************/

h1 ,.h1like {font-size: 1.2em;line-height: 1.2em}
h2 ,.h2like {font-size: 1.2em;line-height: 1.4em}
h3 ,.h3like {font-size: 1.2em;line-height: 1.4em}
h4 ,.h4like {font-size: 1.1em;line-height: 1.4em}

#body09 h3.bs { font-size: 1.2em ; line-height: 1.2em ; margin-bottom: 20px }

span.spkaig { display: block; }
span.maru { padding-left: 0.4em }
.read { text-align: justify; padding-left: 5%;padding-right: 5%; }
.sptxj { text-align: justify; }

/**********************************************************************　サイズの調整　*******************************************************************************/

#yuka.phj img { width: 60%; height: auto }
#yukaf.phj  { width: 100%; height: auto;padding-bottom: 20px }

.formbtn { 
width: 90% ; 
}
.step-zu img { width: 100%;height: auto; }


/***********************************************************************　固定ヘッダー　******************************************************************************/

header { } 
header { padding: 15px 0 0 0;height:35px; }

section { padding-top: 50px }

/************************* 　ロゴ　***************************/

.logol { top: 10px ; left: 15px ; width: 250px;text-align: left} /*　今回はサイズ固定　*/
.logol img { width: 90px ; height: auto;padding-right: 15px }
.logom { width: 60%;margin-left: auto ; margin-right: auto; }
.h1box .logom { width: 50%;margin-left: auto ; margin-right: auto; }

.logos { height: 40%;}
.logos img{ height: 80%;width: auto; }

/******************************************************************** photos（スライドショー大きい画面） ************************************************************************/

#photos{ margin: 0 0 0 0; }
#photosub{ width: 100%; height:300px;background-size: auto 100%;background-position: center center;padding: 0px 0;margin: 0 0 0 0; }

#photos .swiper-pagination{ height: 80px;top: 420px;left: 0; }
#photos .swiper-pagination-bullet { width: 10px;height: 10px;margin: 0 10px; }

#myVideo {  }

/***********************************************************************footer******************************************************************************/

footer{
padding: 20px 0 20px 0;
margin: 0 0 0 0;
}

.logof img { width: 25%;height: auto; }


/**********************************************************************  商品一覧  *******************************************************************************/

#maincpy { padding: 20px 10% }

.card { width: 94.0%;margin-bottom: 5%;}
.cardfll#muscle { margin-bottom: 5%; }
.cardfll#muscle .cardp img { width: 80% ; padding: 20px 10% }
.cardfll#muscle .cardh { width: 80% ; padding: 0 10% }
.cardfll#muscle .cardt { width: 80% ; padding: 0 10% }

.card.card01 span { width: 90.0%;margin-left: 5% ; }
.card.card01 img { width: 90.0%;margin-left: 5% ; }
.card.card02 { width: 44.5%; margin-right: 5% ;margin-bottom: 5%;}
.card.card06 { width: 29.0%; margin-right: 3% ;margin-bottom: 5%;}

.card.card03 { width: 86.0%; margin-right: 0px ;margin-bottom: 20px;}
.card.card04 { width: 99.0%; margin-right: 0px ;margin-bottom: 20px;}

.card.card03 a img ,.card.card04 a img
{width: 100%;height: auto; padding-bottom: 0;}

.card.card03 span ,.card.card04 span
{ width: 58%;float: left;padding-left: 10px ;text-align: left }

.card.card03 span.cardp ,.card.card04 span.cardp
{ width: 30%;float: left;padding-right: 10px ; }

.sdan2 .thmbph { width: 46%; margin-left: 2%; margin-right: 2%;margin-bottom: 20px;padding-bottom: 10px }
.sdan1 .thmbph { width: 70%; margin: 0 15% 0; padding-bottom: 10px }
#body06 .sdan1 .thmbph img { width: 60% ; height: auto }
#body08 .sdan1 .thmbph img { width: 70% ; height: auto }

.tray img{ width: 100%;height: auto; padding-bottom: 0; }

/**********************************************************************　オリジナルデザイン　*************************************************************************/

h2.lps img { width: 30%;height: auto;vertical-align: middle;padding: 10px 20px 15px 0 }
p.lps { background-image: url(../image01/logo2.png);background-repeat: no-repeat;background-position: right 12px ;background-size: 80px auto;padding-right: 100px}
#body02 p.lps { background-image: url(../image02/logo2.png); }
p.ec12 { background-image: url(../image02/ec12.png);background-repeat: no-repeat;background-position: right 10px ;background-size: 100px auto;padding-right: 140px}

.tray.card01 { width: 91.0%; margin: 1% 0% ;padding: 4% 4% 4% 4% }

#body08 #photobg p.abso { top: 20px ; right: 20px ; width: 25% }
#body09 #photobg p.abso { top: 20px ; right: 20px ; width: 16% }

.type-gld { display: block ; padding: 5px 0 }
#gmp-box div.card01 { font-size: 0.8em }

.dnj { background-size: 100px auto; margin-top: 20px ; padding-top: 60px ; background-position: center top }

/**********************************************************************  エフェクト  *******************************************************************************/

/**　　　　　左右２列　　　　　　　**//*@import url(effects.css);*//*　その他は　エフェクト参照*/

.zoom-box {  }
.zoom-box:last-child { padding-bottom: 5%; }
.zoom-box::after { content: ''; clear: both; display: block; }
.zoom-box div {
	position: relative;
	width: 47%;
	height: auto;
	padding: 0;
}

/**　　　　　左右３列　　　　　　　**/

.zoom-box.sandan div {
	width: 30%; padding-top: 50px ; background-color: #000
}

.zoom-box div.zb-lft { float: left; }
.zoom-box div.zb-rgt { float: right; }
.zoom-box.sandan div.zb-lft.cntr { margin-left: 5% }

.zoom-box div:first-child { margin-left: 0; }
.zoom-box div span {
	position: absolute;
	text-align: left;
	width: 80% ;
	top: 10%;
	left: 10%;
	z-index: 1;
	display: block;
	margin: 0;
	padding: 0;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity: 1;
}

td span {display: block}


/**********************************************************************　テーブルのようなリスト　*******************************************************************************/

ul.tblike.pref li.thbox {width: 100%;border-bottom: 1px solid #CCCCCC;}
ul.tblike.pref li.tdbox {display: none}

ul.tblike.pref li.tdbox{width: 95%;text-align: left;padding-left: 5%;}
ul.tblike.pref li.tdbox.brn{width: 95%;text-align: left;padding-left: 5%;}
ul.tblike.pref li.tdbox.add{width: 95%;text-align: left;padding-left: 5%;}

ul.tblike li.end{float: none;clear: left;border-bottom: 0px solid #CCCCCC;}
ul.tblike.nidan {border-top: 1px solid #CCCCCC;}
ul.tblike.nidan li.tdbox{width: 100%;}

.kazai { width: 40%; padding: 0 5% ;margin: 10px 0 }

p.codebtn,
.bribt a { width: 80%;height: 40px;padding: 10px 0 0 0;margin: 20px auto 0 auto; }

header ul li  { padding: 0 }
header ul li a { font-size: 16px;line-height: 16px;padding: 10px 0; }
header ul li.fobt a { background-color: #f1f1f1; }

@media screen and (min-width: 641px) {
body {display: none}
}

/************************* info ***************************/

dl.toiawase  { border-top-width: 1px;border-top-style: solid;border-top-color: #CCCCCC }
dl.toiawase dt { float: none;padding: 0 0 0 0;margin: 10px 0 0 0 ; }
dl.toiawase dd { float: none;border-bottom-width: 1px;border-bottom-style: solid;border-bottom-color: #CCCCCC;padding: 0 0 10px 0;margin: 0 0 10px 0; }

dl.toiawase dt.bikou ,dl.toiawase dd.bikou {  }
dl.toiawase dt.clear-box ,dl.toiawase dd.clear-box { float: none; clear: both ;width: 100%  }

dl.toiawase dt{ width: 100% }
dl.toiawase dd{ width: 100% }

dl.toiawase dd input.meru{ width: 60% !important; }
dl.toiawase dd input.nama{ width: 60% !important; }
dl.toiawase dd input.pos{ width: 60% !important; }
dl.toiawase dd input.add{ width: 97% !important; }
dl.toiawase dd textarea.you{ width: 97% !important; }
dl.toiawase dd textarea.you{ height: 100px !important; }


/**********************************************************************　サイズ調整　*******************************************************************************/

/*---------------------　スマホ用　---------------------*/

.w-wide { width: 90%;margin-left:5%;margin-right:5% }
.w-wide-fl { width: 85%;margin-left:10%;margin-right:5% }
.cw-wide { width: 90%;margin-left:5%;margin-right:5% }

.w-15p{ width: 15%;margin-left:42.5% }
.w-20p{ width: 20%;margin-left:40% }
.w-80p{ width: 90%;margin-left:5% ; }
.w-95p{ width: 95%;margin-left:2.5% ; }
.w-face { width: 70%;margin-left:15% }

.pt-ss { padding-top: 5px }.pb-ss { padding-bottom: 5px }
.pt-s { padding-top: 10px }.pb-s { padding-bottom: 10px }
.pt-m { padding-top: 20px }.pb-m { padding-bottom: 20px }
.pt-l { padding-top: 30px }.pb-l { padding-bottom: 30px }
.pt-ll { padding-top: 50px }.pb-ll { padding-bottom: 50px }

.mt-ss { margin-top: 5px }.mb-ss { margin-bottom: 5px }
.mt-s { margin-top: 10px }.mb-s { margin-bottom: 10px }
.mt-m { margin-top: 20px }.mb-m { margin-bottom: 20px }
.mt-l { margin-top: 30px }.mb-l { margin-bottom: 30px }
.mt-ll { margin-top: 50px }.mb-ll { margin-bottom: 50px }

.pr-s { padding-right: 5px }.pl-s { padding-left: 5px }
.pr-m { padding-right: 10px }.pl-m { padding-left: 10px }
.pr-l { padding-right: 15px }.pl-l { padding-left: 15px }
.pr-ll { padding-right: 20px }.pl-ll { padding-left: 20px }


.lft-5p {left: 5%}
.lft-10p {left: 10%}
.top-20 {top: 20px}