@charset "shift-jis";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

ul, ol { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

hr { display: block; height: 1px; border: 0; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

* { box-sizing: border-box; }

.inner { margin: 0 auto; width: 960px; }
@media screen and (max-width: 959px) { .inner { width: auto; } }

.center { text-align: center !important; }

.right { text-align: right !important; }

.left { text-align: left !important; }

.mt0 { margin-top: 0px !important; }

.mt1 { margin-top: 1px !important; }

.mt2 { margin-top: 2px !important; }

.mt3 { margin-top: 3px !important; }

.mt4 { margin-top: 4px !important; }

.mt5 { margin-top: 5px !important; }

.mt6 { margin-top: 6px !important; }

.mt7 { margin-top: 7px !important; }

.mt8 { margin-top: 8px !important; }

.mt9 { margin-top: 9px !important; }

.mt10 { margin-top: 10px !important; }

.mt15 { margin-top: 15px !important; }

.mt20 { margin-top: 20px !important; }

.mt25 { margin-top: 25px !important; }

.mt30 { margin-top: 30px !important; }

.mt35 { margin-top: 35px !important; }

.mt40 { margin-top: 40px !important; }

.mt45 { margin-top: 45px !important; }

.mt50 { margin-top: 50px !important; }

.ml0 { margin-left: 0px !important; }

.ml1 { margin-left: 1px !important; }

.ml2 { margin-left: 2px !important; }

.ml3 { margin-left: 3px !important; }

.ml4 { margin-left: 4px !important; }

.ml5 { margin-left: 5px !important; }

.ml6 { margin-left: 6px !important; }

.ml7 { margin-left: 7px !important; }

.ml8 { margin-left: 8px !important; }

.ml9 { margin-left: 9px !important; }

.ml10 { margin-left: 10px !important; }

.ml5 { margin-left: 5px !important; }

.ml10 { margin-left: 10px !important; }

.ml15 { margin-left: 15px !important; }

.ml20 { margin-left: 20px !important; }

.ml25 { margin-left: 25px !important; }

.ml30 { margin-left: 30px !important; }

.ml35 { margin-left: 35px !important; }

.ml40 { margin-left: 40px !important; }

.ml45 { margin-left: 45px !important; }

.ml50 { margin-left: 50px !important; }

.mb0 { margin-bottom: 0px !important; }

.mb1 { margin-bottom: 1px !important; }

.mb2 { margin-bottom: 2px !important; }

.mb3 { margin-bottom: 3px !important; }

.mb4 { margin-bottom: 4px !important; }

.mb5 { margin-bottom: 5px !important; }

.mb6 { margin-bottom: 6px !important; }

.mb7 { margin-bottom: 7px !important; }

.mb8 { margin-bottom: 8px !important; }

.mb9 { margin-bottom: 9px !important; }

.mb10 { margin-bottom: 10px !important; }

.mb15 { margin-bottom: 15px !important; }

.mb20 { margin-bottom: 20px !important; }

.mb25 { margin-bottom: 25px !important; }

.mb30 { margin-bottom: 30px !important; }

.mb35 { margin-bottom: 35px !important; }

.mb40 { margin-bottom: 40px !important; }

.mb45 { margin-bottom: 45px !important; }

.mb50 { margin-bottom: 50px !important; }

.mr0 { margin-right: 0px !important; }

.mr1 { margin-right: 1px !important; }

.mr2 { margin-right: 2px !important; }

.mr3 { margin-right: 3px !important; }

.mr4 { margin-right: 4px !important; }

.mr5 { margin-right: 5px !important; }

.mr6 { margin-right: 6px !important; }

.mr7 { margin-right: 7px !important; }

.mr8 { margin-right: 8px !important; }

.mr9 { margin-right: 9px !important; }

.mr10 { margin-right: 10px !important; }

.mr15 { margin-right: 15px !important; }

.mr20 { margin-right: 20px !important; }

.mr25 { margin-right: 25px !important; }

.mr30 { margin-right: 30px !important; }

.mr35 { margin-right: 35px !important; }

.mr40 { margin-right: 40px !important; }

.mr45 { margin-right: 45px !important; }

.mr50 { margin-right: 50px !important; }

.pt0 { padding-top: 0px !important; }

.pt1 { padding-top: 1px !important; }

.pt2 { padding-top: 2px !important; }

.pt3 { padding-top: 3px !important; }

.pt4 { padding-top: 4px !important; }

.pt5 { padding-top: 5px !important; }

.pt6 { padding-top: 6px !important; }

.pt7 { padding-top: 7px !important; }

.pt8 { padding-top: 8px !important; }

.pt9 { padding-top: 9px !important; }

.pt10 { padding-top: 10px !important; }

.pt15 { padding-top: 15px !important; }

.pt20 { padding-top: 20px !important; }

.pt25 { padding-top: 25px !important; }

.pt30 { padding-top: 30px !important; }

.pt35 { padding-top: 35px !important; }

.pt40 { padding-top: 40px !important; }

.pt45 { padding-top: 45px !important; }

.pt50 { padding-top: 50px !important; }

.pl0 { padding-left: 0px !important; }

.pl1 { padding-left: 1px !important; }

.pl2 { padding-left: 2px !important; }

.pl3 { padding-left: 3px !important; }

.pl4 { padding-left: 4px !important; }

.pl5 { padding-left: 5px !important; }

.pl6 { padding-left: 6px !important; }

.pl7 { padding-left: 7px !important; }

.pl8 { padding-left: 8px !important; }

.pl9 { padding-left: 9px !important; }

.pl10 { padding-left: 10px !important; }

.pl15 { padding-left: 15px !important; }

.pl20 { padding-left: 20px !important; }

.pl25 { padding-left: 25px !important; }

.pl30 { padding-left: 30px !important; }

.pl35 { padding-left: 35px !important; }

.pl40 { padding-left: 40px !important; }

.pl45 { padding-left: 45px !important; }

.pl50 { padding-left: 50px !important; }

.pb0 { padding-bottom: 0px !important; }

.pb1 { padding-bottom: 1px !important; }

.pb2 { padding-bottom: 2px !important; }

.pb3 { padding-bottom: 3px !important; }

.pb4 { padding-bottom: 4px !important; }

.pb5 { padding-bottom: 5px !important; }

.pb6 { padding-bottom: 6px !important; }

.pb7 { padding-bottom: 7px !important; }

.pb8 { padding-bottom: 8px !important; }

.pb9 { padding-bottom: 9px !important; }

.pb10 { padding-bottom: 10px !important; }

.pb15 { padding-bottom: 15px !important; }

.pb20 { padding-bottom: 20px !important; }

.pb25 { padding-bottom: 25px !important; }

.pb30 { padding-bottom: 30px !important; }

.pb35 { padding-bottom: 35px !important; }

.pb40 { padding-bottom: 40px !important; }

.pb45 { padding-bottom: 45px !important; }

.pb50 { padding-bottom: 50px !important; }

.pr0 { padding-right: 0px !important; }

.pr1 { padding-right: 1px !important; }

.pr2 { padding-right: 2px !important; }

.pr3 { padding-right: 3px !important; }

.pr4 { padding-right: 4px !important; }

.pr5 { padding-right: 5px !important; }

.pr6 { padding-right: 6px !important; }

.pr7 { padding-right: 7px !important; }

.pr8 { padding-right: 8px !important; }

.pr9 { padding-right: 9px !important; }

.pr10 { padding-right: 10px !important; }

.pr15 { padding-right: 15px !important; }

.pr20 { padding-right: 20px !important; }

.pr25 { padding-right: 25px !important; }

.pr30 { padding-right: 30px !important; }

.pr35 { padding-right: 35px !important; }

.pr40 { padding-right: 40px !important; }

.pr45 { padding-right: 45px !important; }

.pr50 { padding-right: 50px !important; }

.w10 { width: 10px !important; }

.w20 { width: 20px !important; }

.w30 { width: 30px !important; }

.w40 { width: 40px !important; }

.w50 { width: 50px !important; }

.w60 { width: 60px !important; }

.w70 { width: 70px !important; }

.w80 { width: 80px !important; }

.w90 { width: 90px !important; }

.w100 { width: 100px !important; }

.w110 { width: 110px !important; }

.w120 { width: 120px !important; }

.w130 { width: 130px !important; }

.w140 { width: 140px !important; }

.w150 { width: 150px !important; }

.w160 { width: 160px !important; }

.w170 { width: 170px !important; }

.w180 { width: 180px !important; }

.w190 { width: 190px !important; }

.w200 { width: 200px !important; }

.w210 { width: 210px !important; }

.w220 { width: 220px !important; }

.w230 { width: 230px !important; }

.w240 { width: 240px !important; }

.w250 { width: 250px !important; }

.w260 { width: 260px !important; }

.w270 { width: 270px !important; }

.w280 { width: 280px !important; }

.w290 { width: 290px !important; }

.w300 { width: 300px !important; }

.w310 { width: 310px !important; }

.w320 { width: 320px !important; }

.w330 { width: 330px !important; }

.w340 { width: 340px !important; }

.w350 { width: 350px !important; }

.w360 { width: 360px !important; }

.w370 { width: 370px !important; }

.w380 { width: 380px !important; }

.w390 { width: 390px !important; }

.w400 { width: 400px !important; }

.w410 { width: 410px !important; }

.w420 { width: 420px !important; }

.w430 { width: 430px !important; }

.w440 { width: 440px !important; }

.w450 { width: 450px !important; }

.w460 { width: 460px !important; }

.w470 { width: 470px !important; }

.w480 { width: 480px !important; }

.w490 { width: 490px !important; }

.w500 { width: 500px !important; }

.w510 { width: 510px !important; }

.w520 { width: 520px !important; }

.w530 { width: 530px !important; }

.w540 { width: 540px !important; }

.w550 { width: 550px !important; }

.w560 { width: 560px !important; }

.w570 { width: 570px !important; }

.w580 { width: 580px !important; }

.w590 { width: 590px !important; }

.w600 { width: 600px !important; }

.w610 { width: 610px !important; }

.w620 { width: 620px !important; }

.w630 { width: 630px !important; }

.w640 { width: 640px !important; }

.w650 { width: 650px !important; }

.w660 { width: 660px !important; }

.w670 { width: 670px !important; }

.w680 { width: 680px !important; }

.w690 { width: 690px !important; }

.w700 { width: 700px !important; }

.w710 { width: 710px !important; }

.w720 { width: 720px !important; }

.w730 { width: 730px !important; }

.w740 { width: 740px !important; }

.w750 { width: 750px !important; }

.w760 { width: 760px !important; }

.w770 { width: 770px !important; }

.w780 { width: 780px !important; }

.w790 { width: 790px !important; }

.w800 { width: 800px !important; }

.w810 { width: 810px !important; }

.w820 { width: 820px !important; }

.w830 { width: 830px !important; }

.w840 { width: 840px !important; }

.w850 { width: 850px !important; }

.w860 { width: 860px !important; }

.w870 { width: 870px !important; }

.w880 { width: 880px !important; }

.w890 { width: 890px !important; }

.w900 { width: 900px !important; }

.w910 { width: 910px !important; }

.w920 { width: 920px !important; }

.w930 { width: 930px !important; }

.w940 { width: 940px !important; }

.w950 { width: 950px !important; }

.bdrNone { border: none !important; }

.bgNone { background: none !important; }

.top { vertical-align: top !important; }

.middle { vertical-align: middle !important; }

.bottom { vertical-align: bottom !important; }

.bold { font-weight: bold !important; }

.fnt10 { font-size: 1.0rem !important; }

.fnt12 { font-size: 1.2rem !important; }

.fnt14 { font-size: 1.4rem !important; }

.fnt16 { font-size: 1.6rem !important; }

.fnt18 { font-size: 1.8rem !important; }

.fnt20 { font-size: 2.0rem !important; }

.fnt22 { font-size: 2.2rem !important; }

.fnt24 { font-size: 2.4rem !important; }

.fnt26 { font-size: 2.6rem !important; }

.fnt28 { font-size: 2.8rem !important; }

.fnt30 { font-size: 3.0rem !important; }

.floR { float: right !important; }

.floL { float: left !important; }

.floNone { float: none !important; }

.block { display: block !important; }

.inline { display: inline !important; }

.colorRed { color: #cc0000 !important; }

@media screen and (min-width: 960px) { img.pc { display: inline-block !important; }
  .sp, img.sp { display: none; } }
@media screen and (max-width: 959px) { .pc, img.pc { display: none; }
  img.sp { display: inline-block !important; }
  .sp { display: block !important; }
}
html { font-size: 62.5%; }

body { width: 100%; color: #333; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue","Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-size: 2.0rem; overflow-wrap: break-word; word-wrap: break-word; -webkit-text-size-adjust: 100%; }
@media screen and (min-width: 960px) { body { min-width: 960px; line-height: 1.6; } }
@media screen and (max-width: 959px) { body { min-width: 320px; font-size: 1.5rem; line-height: 1.5; } }

a { color: #15b; }
a img { opacity: 1; transition: opacity 0.3s linear; }
@media screen and (min-width: 960px) { a { text-decoration: none; }
  a:hover { text-decoration: underline; }
  a:hover img { opacity: 0.7; }
  a:hover img.pc{ opacity: 1.0;} }

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

/*------------------------------------------------------------------
	Parts
-----------------------------------------------------------------*/
@media screen and (min-width: 960px) { .flexList { font-size: 0; }
  .flexList li { width: 260px; display: inline-block; vertical-align: top; font-size: 1.6rem; }
  .flexList li ~ li { margin-left: 90px; } }

.pos { position: relative; }

.block { display: block; line-height: 0; }

.indent { padding-left: 1em; text-indent: -1em; }

.bg01 { background: url(../img/bg01.jpg); }
@media screen and (max-width: 959px) { .bg01 { background-size: 150px auto; } }

.ttl { margin: 0 auto; min-height: 130px; display: table; width: 100%; background-repeat: no-repeat; background-size: cover; text-align: center; }
.ttl span { display: table-cell; vertical-align: middle; }
@media screen and (min-width: 960px) { .ttl { height: 360px; } }

@media screen and (min-width: 768px) and (max-width: 959px) { .ttl { padding: 30px 0; } }
/*------------------------------------------------------------------
	HEADER
-----------------------------------------------------------------*/
.header { position: relative; max-width: 1440px; margin: 0 auto; }

@media screen and (max-width: 959px) { .headerNavi.sp { width: 100%; background: #897750; }
  .headerNaviList { line-height: 0; display: table; width: 100%; }
  .headerNaviList li { padding-top: 11px; padding-bottom: 11px; display: table-cell; vertical-align: middle; }
  .headerNaviList li ~ li { border-left: 1px solid #a19273; }
  .headerNaviList li span, .headerNaviList li a { width: 100%; }
  .logoHdrSp { padding-left: 10px; width: 49%; }
  .logoHdrSp img { width: 50%; }
  .contactHdrSp { padding-left: 10px; width: 34%; }
  .contactHdrSp img { width: 85%; }
  .naviHdrSp { width: 17%; justify-content: center; text-align: center; }
  .naviHdrSp .open { display: none; }
  .naviHdrSp.is-open img { width: 38%; }
  .naviHdrSp.is-open .close { display: none; }
  .naviHdrSp.is-open .open { display: inline-block; }
  .naviHdrSp img { width: 45%; }
  .mainVisual { line-height: 0; } }
@media screen and (min-width: 960px) { .logoHdrPc { position: absolute; left: 40px; top: 30px; }
  .contactHdrPc { position: absolute; right: 20px; top: 20px; } }
@media screen and (min-width: 960px) { .mainVisual img { display: none; } }
@media screen and (max-width: 959px) { .mainVisual { background: none; text-align: center; }
  .mainVisual img { object-fit: cover; width: 100%; max-height: 1200px; } }
/*------------------------------------------------------------------
	navi
-----------------------------------------------------------------*/
@media screen and (max-width: 959px) { .navi { width: 100%; position: fixed; left: 0; display: none; background: #fff; z-index: 100; }
  .naviList { text-align: center; }
  .naviList li { border-bottom: 1px solid #ddd; line-height: 1; }
  .naviList a { padding: 23px 0; width: 100%; display: block; color: #897750; text-decoration: none; } }
@media screen and (min-width: 960px) { .navi { margin-top: -55px; padding: 60px 0 30px; position: relative; background: url(../img/bgNav.png) no-repeat top center; z-index: 1; }
  .naviList { margin-top: 30px; font-size: 0; }
  .naviList li { height: 32px; display: inline-block; border-left: 1px solid #ddd; background-repeat: no-repeat; background-position: center center; text-indent: -9999px; overflow: hidden; white-space: nowrap; }
  .naviList li:hover { transition: background-image 0.3s linear; }
  .naviList a { padding: 5px 0; width: 100%; height: 100%; display: block; }
  .nav01 { width: 175px; background-image: url(../img/nav01.jpg); }
  .nav01:hover { background-image: url(../img/nav01Over.jpg); }
  .nav02 { width: 173px; background-image: url(../img/nav02.jpg); }
  .nav02:hover { background-image: url(../img/nav02Over.jpg); }
  .nav03 { width: 164px; background-image: url(../img/nav03.jpg); }
  .nav03:hover { background-image: url(../img/nav03Over.jpg); }
  .nav04 { width: 182px; background-image: url(../img/nav04.jpg); }
  .nav04:hover { background-image: url(../img/nav04Over.jpg); }
  .nav05 { width: 102px; background-image: url(../img/nav05.jpg); }
  .nav05:hover { background-image: url(../img/nav05Over.jpg); }
  .nav06 { width: 160px; border-right: 1px solid #ddd; background-image: url(../img/nav06.jpg); }
  .nav06:hover { background-image: url(../img/nav06Over.jpg); } }
/*------------------------------------------------------------------
	contents
-----------------------------------------------------------------*/
/* about *******************/
@media screen and (max-width: 959px) { .about { margin-top: -60px; padding: 60px 0 40px; } }
@media screen and (min-width: 960px) { .about { padding-bottom: 90px; } }

.aboutHeaderCont { padding: 50px 15px 60px; position: relative; background: url(../img/sp/bgAbout01.png) no-repeat 0 20px; background-size: 100% auto; }
@media screen and (max-width: 959px) { .aboutHeaderCont { text-align: center; }
  .aboutHeaderCont h2 img { width: 68%; } }
@media screen and (min-width: 960px) { .aboutHeaderCont { padding: 60px 260px 50px 0; height: 100%; background: url(../img/bgAbout01.png) no-repeat left center, url(../img/bgAbout02.png) no-repeat 86% 55%; } }

@media screen and (min-width: 960px) { .aboutTtl { text-align: right; } }
/* aboutDetail */
.aboutDetail { margin: 0 auto; max-width: 1440px; overflow: hidden; }
.aboutDetail strong { text-align: center; }
@media screen and (max-width: 959px) { .aboutDetail { margin-top: -60px; padding-top: 60px; } }

.aboutDetailPhoto { line-height: 0; }

@media screen and (min-width: 1181px) { .aboutDetail { min-width: 960px; }
  .aboutDetailText { width: calc(100% - 660px); }
  .aboutDetailTextCont { margin: 0 auto; width: 490px; }
  .about01 { margin-top: 70px; }
  .about02 { margin-top: 100px; } }
@media screen and (min-width: 960px) and (max-width: 1180px) { .aboutDetailPhoto, .aboutDetailText { width: 48%; }
  .aboutDetailTextCont { width: 100%; } }
@media screen and (min-width: 960px) { .aboutDetailPhoto, .about02 .aboutDetailText { float: left; }
  .aboutDetailText, .about02 .aboutDetailPhoto { float: right; }
  .aboutDetailText p { margin-top: 40px; }
  .aboutDetailText { padding-top: 1em; }
  .about01 { padding-top: 70px; }
  .about02 { margin-top: 100px; } }
@media screen and (max-width: 959px) { .aboutDetail { width: 100%; }
  .aboutDetail strong { margin-top: 28px; }
  .aboutDetailPhoto { text-align: center; }
  .aboutDetailText { width: 100%; }
  .aboutDetailTextCont { width: 100%; padding: 0 15px; }
  .aboutDetailTextCont > p { margin-top: 25px; }
  .about01 strong img { width: 79%; }
  .about02 { margin-top: 35px; }
  .about02 strong img { width: 43%; } }
/* youjou *******************/
@media screen and (max-width: 959px) { .youjou { margin-top: -60px; padding-top: 60px; } }

@media screen and (max-width: 959px) { .youjouInner { padding: 50px 15px 40px; }
  .youjouTtl { text-align: center; }
  .youjouTtl img { width: 96%; }
  .youjouLead { margin-top: 20px; }
  .youjouList { margin-top: 30px; text-align: center; }
  .youjouList li ~ li { margin-top: 20px; } }
@media screen and (min-width: 960px) { .youjouInner { padding: 130px 0 120px; background-position: 50% 60px; text-align: center; }
  .youjouListTtl { width: 66px; }
  .youjouLead { margin-top: 50px; font-size: 1.8rem; }
  .youjouList { margin-top: 60px; overflow: hidden; }
  .youjouList li { float: left; }
  .youjouList li ~ li { float: right; } }
/* 入浴 */
.bath { padding: 40px 0 50px; }
.bath .flexList strong { text-align: center; }
.bath .flexList p { margin-top: 1em; }
@media screen and (max-width: 959px) { .bath .flexList { padding: 0 15px; }
  .bath .flexList li { margin-top: 25px; }
  .bath .flexList li ~ li { margin-top: 30px; }
  .bath .bath01 img { width: 49%; }
  .bath .bath02 img { width: 44%; }
  .bath .bath03 img { width: 39%; } }
@media screen and (min-width: 960px) { .bath { padding: 100px 0; }
  .bath .flexList { margin-top: 70px; } }

@media screen and (max-width: 959px) { .bathHeader { background: url(../img/sp/bgBath02.jpg) repeat-x 0 53%; background-size: 320px auto; } }
@media screen and (min-width: 960px) { .bathHeader { background: url(../img/bgBath02.jpg) repeat-x center center; } }

.bathHeaderCont p { text-align: center; }
@media screen and (max-width: 959px) { .bathHeaderCont { padding: 0 15px; background: url(../img/bgBath01.png) no-repeat -18% 37%; background-size: 47% auto; }
  .bathHeaderCont .bathTtl { margin-bottom: 18px; width: 100%; text-align: center; }
  .bathHeaderCont .bathTtl img { width: 64%; } }
@media screen and (min-width: 960px) { .bathHeaderCont { overflow: hidden; background: url(../img/bgBath01.png) no-repeat 560px 0; }
  .bathHeaderCont .bathTtl { float: right; }
  .bathHeaderCont > p { float: left; } }

/* HSPとは */
.aboutHsp { padding: 50px 0; background: url(../img/sp/bgHsp02.png) no-repeat, url(../img/sp/bgHsp03.png) no-repeat, url(../img/sp/bgHsp01.jpg); background-position: top 0 left 0, bottom 0 left 0, 0 0; background-size: 100% auto, 100% auto, auto; }
.aboutHsp h3 { text-align: center; }
@media screen and (max-width: 959px) { .aboutHsp h3 img { width: 58%; }
  .aboutHsp .inner { margin-top: 25px; padding: 0 38px; } }
@media screen and (min-width: 960px) { .aboutHsp { padding: 80px 0 0; height: 352px; background: url(../img/bgHsp01.jpg) no-repeat top center; background-size: cover; }
  .aboutHsp .inner { margin-top: 30px; } }

/* medicine *******************/
@media screen and (max-width: 959px) { .medicine { margin-top: -60px; padding-top: 60px; } }

@media screen and (max-width: 959px) { .medicineInner { padding: 0 15px; } }

.medicineTtl { background-image: url(../img/sp/bgMedicine.jpg); }
@media screen and (min-width: 960px) { .medicineTtl { background-image: url(../img/bgMedicine.jpg); } }

.medicineInnerTtl { margin-top: 60px; text-align: center; }
@media screen and (max-width: 959px) { .medicineInnerTtl { margin-top: 30px; }
  .medicineInnerTtl img { width: 61%; } }

.medicineLead { margin-top: 25px; text-align: center; }
@media screen and (min-width: 960px) { .medicineLead { margin-top: 60px; } }

.medicineTop { margin-top: 35px; }
@media screen and (max-width: 959px) { .medicineTop { text-align: center; }
  .medicineTop .medicineTopImg { margin-top: 15px; }
  .medicineTop .medicineTopImg img { width: 73%; }
  .medicineTop .medicineTopTxt { margin-top: 20px; text-align: left; } }
@media screen and (min-width: 960px) { .medicineTop { margin: 50px auto 0; width: 660px; height: 255px; position: relative; }
  .medicineTop .medicineTopImg { position: absolute; left: -15px; top: 30px; }
  .medicineTop strong { width: 282px; float: right; }
  .medicineTop .medicineTopTxt { margin-top: 20px; width: 282px; position: absolute; right: 0; top: 111px; } }

.medicineList { margin-bottom: 50px; font-size: 0; }
.medicineList li { display: inline-block; vertical-align: top; }
@media screen and (max-width: 959px) { .medicineList li { margin-top: 50px; width: 47%; font-size: 1.4rem; }
  .medicineList li:nth-of-type(n+3) { margin-top: 20px; }
  .medicineList li:nth-of-type(even) { margin-left: 6%; }
  .medicineList .medicineListTtl { text-align: center; } }
@media screen and (min-width: 960px) { .medicineList { margin: 75px auto 100px; text-align: center; }
  .medicineList li { width: 280px; font-size: 2.0rem; }
  .medicineList li ~ li { margin-left: 60px; }
  .medicineList li:nth-of-type(4) { margin-left: 0; }
  .medicineList li:nth-of-type(n+4) { margin-top: 40px; }
  .medicineList p { margin-top: 12px; text-align: left; } }

/* aboutMedicine */
.aboutMedicine { padding: 50px 15px 60px; }
@media screen and (min-width: 960px) { .aboutMedicine { padding: 80px 0 100px; } }

.aboutMedicineTtl { text-align: center; }
@media screen and (max-width: 959px) { .aboutMedicineTtl img { width: 96%; } }

.aboutMedicineCont { margin-top: 1.5em; }
@media screen and (min-width: 960px) { .aboutMedicineCont { margin-top: 55px; } }

.aboutMedicineImg { margin-top: 25px; color: #897750; font-size: 1.0rem; text-align: center; }
@media screen and (min-width: 960px) { .aboutMedicineImg { margin: 40px auto 0; width: 740px; font-size: 1.6rem; text-align: right; } }

.aboutMedicineNotice { margin-top: 1em; }
@media screen and (min-width: 960px) { .aboutMedicineNotice { line-height: 1; } }

/* kodawari *******************/
.kodawari { padding-bottom: 70px; }
@media screen and (max-width: 959px) { .kodawari { margin-top: -60px; padding-top: 60px; } }

.kodawariTtl { background: url(../img/sp/bgKodawari.jpg) no-repeat 0 0; background-size: cover; }
@media screen and (max-width: 959px) { .kodawariTtl img { width: 70%; } }
@media screen and (min-width: 960px) { .kodawariTtl { background-image: url(../img/bgKodawari.jpg); } }

.kodawariDetail { margin-top: 30px; text-align: center; }
@media screen and (max-width: 959px) { .kodawariDetail { padding: 0 15px; }
  .kodawariDetail ~ .kodawariDetail { margin-top: 40px; }
  .kodawariDetail figure { margin-top: 1.8em; } }
@media screen and (min-width: 960px) { .kodawariDetail { margin-top: 75px; }
  .kodawariDetail figure { margin-top: 50px; line-height: 0; } }

@media screen and (max-width: 959px) { .kodawariDetailTtl.ttl01 img { width: 75%; }
  .kodawariDetailTtl.ttl02 img { width: 71%; } }
.kodawariLead { margin-top: 1.5em; }
@media screen and (min-width: 960px) { .kodawariLead { margin-top: 50px; } }

/* cart *******************/
@media screen and (max-width: 959px) { .cart { margin-top: -60px; padding: 90px 0 0; } }
@media screen and (min-width: 960px) { .cart { padding-top: 110px; } }

@media screen and (max-width: 959px) { .cartHeaderCont { padding: 0 15px; } }
@media screen and (min-width: 960px) { .cartHeaderCont { margin: 0 auto; height: 480px; position: relative; background: url(../img/bgCart01.jpg) no-repeat 0 0; background-size: cover; } }

@media screen and (max-width: 959px) { .cartTtl { margin: 0 -15px; padding: 100% 0 23%; }
  .cartTtl img { position: absolute; top: -30px; left: 4%; width: 92%; z-index: 5; } }
@media screen and (min-width: 960px) { .cartTtl { position: absolute; left: calc(50% - 270px); top: -110px; text-align: center; background: none; } }

/* 商品詳細 */
.cartDetail { margin-top: -10%; position: relative; z-index: 1; }
@media screen and (min-width: 960px) { .cartDetail { margin-top: -50px; } }

.cartDetailTtl, .cartDetailNotice { text-align: center; }

.amazonButton { margin-top: 20px; }
.amazonButton img { width: 136px; }

@media screen and (max-width: 959px) { .cartDetailTtl img { width: 59%; }
  .amazonButton img { width: 110px; } }
.cartDetailNotice { margin-top: 10px; font-size: 1.3rem; }
@media screen and (min-width: 960px) { .cartDetailNotice { margin-top: 20px; font-size: 1.6rem; } }

.btn_order_login { background-color: #000000; color: #FFFFFF !important;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all .3s; transition: all .3s; font-size: 1em; padding: 7px; text-decoration: none; }
.btn_order_login:hover { background-color: #EEEEEE; text-decoration: none;}

.btn { margin-top: 27px; text-align: center; }
.btn a { margin: 0 auto; width: 100%; padding: 7% 0; display: block; border-radius: 5px; color: #fff; font-weight: bold; font-size: 1.6rem; background: #cfd400; line-height: 1; text-decoration: none; }
.btn + .cartDetailList { margin-top: 40px; }
@media screen and (min-width: 960px) { .btn { margin-top: 30px; }
  .btn a { padding: 26px 0; width: 380px; font-size: 2rem; transition: all .3s linear; }
  .btn a:hover { background: #e7ea76; text-decoration: none; }
  .btn + .cartDetailList { margin-top: 50px; } }

.cartDetailList { border-right: 1px solid #ddd; border-left: 1px solid #ddd; font-size: 1.5rem; }
.cartDetailList:last-child { border-bottom: 1px solid #ddd; }
.cartDetailList dt { padding: 10px; border-top: 1px solid #ddd; background: #f5f5f5; }
.cartDetailList dd { padding: 15px 10px; border-top: 1px solid #ddd; }
@media screen and (max-width: 959px) { .cartDetailList { margin: 0 15px; } }
@media screen and (min-width: 960px) { .cartDetailList { width: 100%; display: table; }
  .cartDetailList dt, .cartDetailList dd { display: table-cell; }
  .cartDetailList dt { padding: 30px 0 0 25px; width: 205px; }
  .cartDetailList dd { padding: 30px 25px 35px; border-left: 1px solid #ddd; } }

.productList { margin: 20px 15px 30px; text-align: center; }
@media screen and (min-width: 960px) { .productList { display: table; border-collapse: separate; border-spacing: 10px 0; width: 780px; margin: 50px auto 60px; } }
.productList div { margin-bottom: 10px; }
@media screen and (min-width: 960px) { .productList div { display: table-cell; vertical-align: top; } }
.productList div:first-child { padding-top: 10px; }

.cta { margin-bottom: 60px; padding: 40px 40px 20px; background: url("../img/bgCta.gif") repeat; text-align: center; }

.CPareaDetail { text-align: center; }
@media screen and (max-width: 959px) { .CPareaDetail { margin-top: -60px; padding-top: 60px; text-align: center; } }

/* faq *******************/
@media screen and (max-width: 959px) { .faq { margin-top: -50px; padding: 110px 15px 50px; } }
.faq .inner { margin-top: 17px; }
@media screen and (min-width: 960px) { .faq { margin-top: 60px; padding-bottom: 100px; }
  .faq .inner { margin-top: 40px; } }

@media screen and (max-width: 959px) { .faqTtl img { width: 34%; } }
@media screen and (min-width: 960px) { .faqList { font-size: 1.8rem; } }
.faqList dt { padding: 0 12px; background: #f0f0e1; }
.faqList dt span { padding: 15px 45px 15px 1em; display: block; font-weight: bold; background: url(../img/iconFaq02.jpg) no-repeat; background-position: right 0 top 50%; background-size: 26px auto; text-indent: -1em; }
.faqList dt span::before { color: #8b7a4d; content: "Q."; }
.faqList dt .open { background-image: url(../img/iconFaq01.jpg); }
@media screen and (min-width: 960px) { .faqList dt { padding: 0 15px 0 20px; }
  .faqList dt span { padding: 15px 40px 15px 1.5em; background-size: 30px auto; }
  .faqList dt:hover { cursor: pointer; } }
.faqList dd { padding: 10px 12px 20px; }
.faqList dd + dt { margin-top: 5px; }
@media screen and (min-width: 960px) { .faqList dd { padding: 20px 20px 15px; }
  .faqList dd + dt { margin-top: 4px; } }

/* lineup *******************/
.lineup { padding-bottom: 50px; }
@media screen and (min-width: 960px) { .lineup { padding-bottom: 80px; } }

.lineupTtl { padding-left: 15px; padding-right: 15px; background-image: url(../img/sp/bgLineup.jpg); }
@media screen and (max-width: 959px) { .lineupTtl img { width: 95%; } }
@media screen and (min-width: 960px) { .lineupTtl { background-image: url(../img/bgLineup.jpg); } }

.lineupLead { margin-top: 30px; }
@media screen and (max-width: 959px) { .lineupLead { padding: 0 15px; } }
@media screen and (min-width: 960px) { .lineupLead { margin-top: 50px; padding-left: 50px; font-size: 0; vertical-align: middle; }
  .lineupLead p { padding: 0 0 0 50px; width: 530px; display: inline-block; font-size: 2.0rem; } }

.lineupLeadImg { line-height: 0; }
@media screen and (max-width: 959px) { .lineupLeadImg { margin-bottom: 20px; text-align: center; }
  .lineupLeadImg img { width: 77%; } }
@media screen and (min-width: 960px) { .lineupLeadImg { width: 321px; display: inline-block; } }

.lineupList { margin-top: 25px; font-size: 0; line-height: 0; }
.lineupList li { display: inline-block; }
@media screen and (max-width: 959px) { .lineupList { padding: 0 15px; }
  .lineupList li { width: 48%; text-align: center; }
  .lineupList li:nth-of-type(n+3) { margin-top: 10px; }
  .lineupList li:nth-of-type(even) { margin-left: 4%; }
  .lineupList li img { width: 100%; } }
@media screen and (min-width: 960px) { .lineupList { margin-top: 50px; }
  .lineupList li ~ li { margin-left: 18px; } }

/*------------------------------------------------------------------
	footer
-----------------------------------------------------------------*/
.footer { padding: 0 15px 40px; color: #999; font-size: 1.0rem; text-align: center; }
@media screen and (min-width: 960px) { .footer { padding: 0 0 60px; font-size: 1.5rem; } }

/*------------------------------------------------------------------
	social
-----------------------------------------------------------------*/
.social { position: relative; float: right; margin: 22px 0 0; }
.social ul li { float: left; width: 100px; }
.social ul li * { line-height: 1; }

/*# sourceMappingURL=base.css.map */