@charset "UTF-8";

/* ==================================================
   表示制御用ユーティリティクラス
================================================== */
@media screen and (max-width: 767px) {
  .pc-only { display: none !important; }
}
@media screen and (min-width: 768px) {
  .sp-only { display: none !important; }
}

/* ==================================================
   PC用スタイル (min-width: 768px)
================================================== */
@media screen and (min-width: 768px) {
	section.mv { height: 350px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
	section.mv .inner_mv { display: table; width: 100%; height: 100%; }
	section.mv .inner_mv .container { display: table-cell; position: relative; vertical-align: middle; text-align: center; }
	section.mv .inner_mv .container .ttl { font-size: 36px; font-weight: normal; letter-spacing: 2px; color: #FFFFFF; }
	section.mv .inner_mv .container .ttl_sub { height: 12px; margin-top: 12px; }
	.ttl { text-align: center; }
	.ttl-copy { color: #333333; font-size: 26px; letter-spacing: 4px; margin-top: 20px; text-align: center; font-weight: normal; }
	.inner_menu { width: 1000px; margin: 0 auto; }
	.desc-img { display: block; float: right; padding-left: 15px; }
	.desc-txt { margin-bottom: 1.5em; }
	.inner_othermenu { margin: 0 auto; padding-top: 50px; text-align: center; width: 1000px; }
	.othermenulist { margin-bottom: 60px; margin-top: 45px; overflow: hidden; text-align: left; }
	.othermenulist .title { display: block; line-height: 1.8; }
	.othermenulist li a:hover .title { animation: qa_arrow_on 500ms cubic-bezier(0.215, 0.61, 0.355, 1); }
	.othermenulist li { border: 1px solid #bf9c7b; border-radius: 6px; box-sizing: border-box; display: block; float: left; line-height: 1.5; padding: 25px 30px; width: 487px; }
	.othermenulist a { display: block; text-decoration: none; }
	.othermenulist li + li { margin-left: 25px; }
	.othermenulist li.condensed { letter-spacing: -0.1em; }
	section.qa { background-color: #fbf9f5; margin-top: 80px; }
	section.qa .inner_qa { width: 1000px; margin: 0 auto; padding: 60px 0 60px 0; }
	section.qa .inner_qa .ttl { font-size: 26px; font-weight: normal; color: #b39a7a; text-align: center; }
	section.qa .inner_qa .ttl p { margin-bottom: 16px; }
	.btn.btn-primary { background-color: #521114; border: 0; }
	.contents .btn { font-size: 16px; line-height: 60px; height: 60px; display: inline-block; padding: 0 90px; color: #bf9c7b; text-decoration: none; box-sizing: border-box; transition: all 200ms 0ms linear; text-align: center; text-decoration: none; position: relative; }
	.btn:after { background-repeat: no-repeat; content: ''; display: block; position: absolute; top: 50%; }
	.btn.btn-vert:after { right: 24px; width: 9px; height: 15px; margin-top: -7px; }
	.btn.btn-vert:hover:after { animation: btn_vert 500ms cubic-bezier(0.215, 0.61, 0.355, 1); }
	@keyframes btn_vert { 0% { transform: translateY(0px); } 10% { transform: translateY(10px); } 100% { transform: translateY(0px); } }
	.btn.btn-horiz:after { right: 20px; width: 15px; height: 7px; margin-top: -3px; }
	.btn.btn-horiz:hover:after { animation: btn_horiz 500ms cubic-bezier(0.215, 0.61, 0.355, 1); }
	@keyframes btn_horiz { 0% { transform: translateX(0px); } 10% { transform: translateX(10px); } 100% { transform: translateX(0px); } }
	.btn.btn-primary:hover { color: #fff; background-color: #9f8e6e; }
	.btn.btn-block { padding-left: 0; padding-right: 0; display: block; }

	section.mv { background-image: url(images/service-prevention-breath-main.png); }
	section.mv .inner_mv{ background: none !important; }
	section.mv .inner_mv .container .ttl{ color:#004EA2 !important; }
	section.menu{ background: #D9E5F1 !important; padding:60px 0; }
	.ttl-copy{ color:#004EA2 !important; }
	.basics{ max-width: 900px; border: solid 1px #004EA2; margin:60px auto 50px; padding:30px 40px; text-align: center; }
	.basics .h2-ttl{ font-size: 27px !important; color:#004EA2 !important; padding-bottom:25px; }
	.basics p{ line-height: 1.8em; }
	.newbtn_pink { width: 100%; max-width: 286px; height: 62px; color: #fff; font-size: 15px; line-height: 1.5; text-decoration: none; background: #ec6d81; border-bottom: 5px solid #AB2945; display: flex; justify-content: center; align-items: center; position: relative; transition:all 0.4s; padding-right: 3%; }
	.newbtn_pink::after { content: ""; width: 14px; height: 22px; background: url("/common/img/btn_arrow_white.svg") no-repeat center; background-size: 14px auto; position: absolute; top: 0; right: 5.5%; bottom: 0; margin: auto; }
	.newbtn_pink:hover { opacity: 0.7; }
	.newbtn_pink::before { content: ''; display: block; width: 35px; height: 32px; background: url("/common/img/header_icon_reserve.svg") no-repeat 50%; background-size: auto 32px; margin-right: 0.5em; }
	.inner_menu{ width: 900px !important; }
	.ttl-copy{ margin-bottom:30px; }
	.shindan{ border: solid 1px #004EA2; margin-bottom:15px; }
	.shindan h3{ background: #004EA2; text-align: center; color:#fff; font-weight: 700; font-size: 20px; padding:0.8em; }
	.shindan .inner{ background: #fff; padding:30px 40px 40px; position: relative; }
	.shindan h4{ text-align: center; font-weight: 700; font-size: 18px; line-height: 1.4em; padding-bottom:0.5em; border-bottom:solid 1px #004EA2; margin-bottom:30px; }
	.shindan .flex{ display: flex; flex-wrap:wrap; justify-content: space-between; align-items: center; width: 75%; padding-bottom:20px; }
	.shindan .flex .price{ font-size: 2.5em; font-weight: 700; color:#004EA2; width:25%; }
	.shindan .flex .price span{ font-size: 0.7em; }
	.shindan .flex .time{ background: #E7F5FB; width: 70%; padding:5px 15px; text-align:left; font-size: 1em; line-height: 1.4em; }
	.shindan .flex .time span{ font-size: 0.8em; }
	.shindan .txt1{ width: 75%; line-height: 1.8em; }
	.shindan .inner .desc-img{ position: absolute; right:50px; top:120px; }
	.main_contents_bottom{ line-height: 1.7em; padding-left: 1em; font-size: 0.9em; }
	section.common__qa{ background: #fff !important; margin:0 !important; color:#666666; padding:50px 0 !important; }
	.qa-title{ font-size: 25px; font-weight: 700; line-height: 1.3em; text-align: center; padding-bottom:30px; }
	section.qa .inner_qa{ width: 900px; }
	section.qa .inner_qa dl{ padding:40px 0; }
	section.qa .inner_qa dl.bg{ background: #FDF0F2; margin:0 -100%; padding:40px 100%; }
	section.qa .inner_qa dl dt{ position: relative; padding:10px 0 10px 40px; font-size: 18px; }
	section.qa .inner_qa dl dt::before{ content: "Q."; color:#EC6D81; font-size: 30px; position: absolute; left: 0; top:0; }
	section.qa .inner_qa dl.bg dt::before{ color:#004EA2; }
	section.qa .inner_qa dl dd{ position: relative; padding:10px 0 10px 40px; line-height: 1.8em; }
	section.qa .btn{ text-align: center; padding-top:60px; }
	section.qa .btn a{ color:#666666; font-size: 18px; text-decoration: underline; }
	.bg1{ background: #DCF1F9; margin:0 !important; padding:60px 0; }
	.inner_othermenu { margin: 0 auto; padding-top: 0; text-align: center; width: 900px; }
	.othermenu .h2-ttl{ background: #004EA2; color:#fff; font-size: 20px; font-weight: 700; padding:0.8em !important; text-align: center; }
	.othermenulist{ display: flex; flex-wrap:wrap; justify-content: space-between; }
	.othermenulist li{ width: 48%; background: #fff; border: none !important; padding:15px !important; border-radius: 0 !important; }
	.othermenulist li .title{ width: 100% !important; border-bottom:solid 1px #004EA2; text-align: center; color:#004EA2 !important; background: none !important; font-size: 20px !important; font-weight: 700 !important; padding-bottom:8px !important; margin-bottom:15px; }
	.othermenulist li p{ min-height: 6em; }
	.othermenulist li .btn{ width: 90%; margin:15px auto 10px; border: solid 2px #004EA2; padding:15px; text-align: center; color:#004EA2; background: url("/common/img/btn_arrow_blue.svg") no-repeat 95% center; background-size: 1em auto; }
	.othermenulist li .btn:hover{ background:#004EA2 url("/common/img/btn_arrow_white.svg") no-repeat 95% center; background-size: 1em auto; color:#fff; }
	body{ width: 100%; overflow-x: hidden; }
}

/* ==================================================
   SP用スタイル (max-width: 767px)
================================================== */
@media screen and (max-width: 767px) {
	section.mv { height: 200px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
	section.mv .inner_mv { display: table; line-height: 1.4; width: 100%; height: 100%; }
	section.mv .inner_mv .container { display: table-cell; vertical-align: middle; position: relative; text-align: center; }
	section.mv .inner_mv .container .ttl { font-size: 20px; font-weight: normal; letter-spacing: 2px; color: #FFFFFF; }
	section.mv .inner_mv .container .ttl_sub { height: 12px; }

	.link_btn a { text-decoration: none; }
	section.menu { background-color: #ebe6dc; }
	section.menu .inner_menu { margin: 0 auto; padding: 0 0 20px 0; }
	p.ttl_sub { margin: 0px auto; padding-top: 10px; width: 52%; }
	section.menu h3 .eiji_ttl { width: 19%; display: block; margin: 0 auto; }
	section.feature { background: #f7f4f0; }
	section.feature h3 { width: 86%; margin: 0 auto; padding-top: 15px; }
	.ttl_explain{ font-size: 1.27273em; line-height: 1.85714; margin: 4vw auto; width: 86%; }

	section.mv { background-image: url(images/service-prevention-breath-holdamouth.png); }
	section.mv .inner_mv{ background: none !important; }
	section.mv .inner_mv .container .ttl{ color:#004EA2 !important; font-size: 25px !important; }
	section.menu{ background: #D9E5F1 !important; padding:8vw 4vw; }
	.ttl-copy{ color:#004EA2 !important; }
	.basics{ width: 92%; max-width: 900px; border: solid 1px #004EA2; margin:4vw auto 6vw; padding:1.5em; text-align: center; }
	.basics .h2-ttl{ font-size: 21px !important; color:#004EA2 !important; padding-bottom:25px; }
	.basics p{ text-align: left; line-height: 1.8em; }
	.newbtn_pink { width: 100%; max-width: 100%; height: 62px; color: #fff; font-size: 15px; line-height: 1.5; text-decoration: none; background: #ec6d81; border-bottom: 5px solid #AB2945; display: flex; justify-content: center; align-items: center; position: relative; transition:all 0.4s; padding-right: 3%; }
	.newbtn_pink::after { content: ""; width: 14px; height: 22px; background: url("/common/img/btn_arrow_white.svg") no-repeat center; background-size: 14px auto; position: absolute; top: 0; right: 5.5%; bottom: 0; margin: auto; }
	.newbtn_pink:hover { opacity: 0.7; }
	.newbtn_pink::before { content: ''; display: block; width: 35px; height: 32px; background: url("/common/img/header_icon_reserve.svg") no-repeat 50%; background-size: auto 32px; margin-right: 0.5em; }
	.inner_menu{ width: 100% !important; }
	.ttl-copy{ text-align: center; font-size: 25px; margin-bottom:1em; }
	.shindan{ border: solid 1px #004EA2; margin-bottom:15px; }
	.shindan h3{ background: #004EA2; text-align: center; color:#fff; font-weight: 700; font-size: 20px; padding:0.8em; }
	.shindan .inner{ background: #fff; padding:1em; position: relative; }
	.shindan h4{ text-align: center; font-weight: 700; font-size: 18px; line-height: 1.4em; padding-bottom:0.5em; border-bottom:solid 1px #004EA2; margin-bottom:30px; }
	.shindan .flex{ display: flex; flex-wrap:wrap; justify-content: space-between; align-items: center; width: 100%; padding-bottom:20px; }
	.shindan .flex .box{ width: 70%; }
	.shindan .flex .price{ font-size: 2em; font-weight: 700; color:#004EA2; width:100%; padding-bottom:15px; }
	.shindan .flex .price span{ font-size: 0.7em; }
	.shindan .flex .time{ background: #E7F5FB; width: 100%; padding:5px 15px; text-align:left; font-size: 1em; line-height: 1.4em; }
	.shindan .flex .time span{ font-size: 0.8em; }
	.shindan .txt1{ width: 100%; line-height: 1.8em; }
	.shindan .flex .pic{ width: 26%; }
	.main_contents_bottom{ line-height: 1.7em; padding-left: 0; margin:-2em 0; font-size: 0.9em; }
	section.common__qa{ background: #fff !important; margin:0 !important; color:#666666; padding:9vw 4vw !important; }
	.qa-title{ font-size: 25px; font-weight: 700; line-height: 1.3em; text-align: center; padding-bottom:0.8em; }
	section.qa .inner_qa{ width: 100%; }
	section.qa .inner_qa dl{ padding:7vw 0; }
	section.qa .inner_qa dl.bg{ background: #FDF0F2; margin:0 -4vw; padding:5vw 4vw; }
	section.qa .inner_qa dl dt{ position: relative; padding:0 0 0 1.5rem; font-size: 21px; line-height: 1.6em; }
	section.qa .inner_qa dl dt::before{ content: "Q."; color:#EC6D81; font-size: 1.1rem; position: absolute; left: 0; top:0; }
	section.qa .inner_qa dl.bg dt::before{ color:#004EA2; }
	section.qa .inner_qa dl dd{ position: relative; padding:10px 0 10px 1.5rem; line-height: 1.8em; }
	section.qa .btn{ text-align: center; padding-top:4vw; background: none !important; }
	section.qa .btn a{ background: none !important; color:#666666; font-size: 18px; text-decoration: underline !important; }
	.bg1{ background: #DCF1F9; margin:0 !important; padding:8vw 0; }
	.inner_othermenu { margin: 0 auto; padding-top: 0; text-align: center; width: 92%; }
	.othermenu .h2-ttl{ background: #004EA2; color:#fff; font-size: 16px; font-weight: 700; padding:0.8em !important; text-align: center; }
	.othermenulist{ padding:1em 0; }
	.othermenulist li{ width: 100%; background: #fff; border: none !important; padding:15px !important; border-radius: 0 !important; margin-bottom:1em; }
	.othermenulist li a{ text-decoration: none !important; }
	.othermenulist li .title{ width: 100% !important; border-bottom:solid 1px #004EA2; text-align: center; color:#004EA2 !important; background: none !important; font-size: 20px !important; font-weight: 700 !important; padding-bottom:8px !important; margin-bottom:15px; }
	.othermenulist li p{ min-height: auto; text-align: left; line-height: 1.8em; }
	.othermenulist li .btn{ width: 90%; margin:15px auto 10px; border: solid 2px #004EA2; padding:15px; text-align: center; color:#004EA2; background: url("/common/img/btn_arrow_blue.svg") no-repeat 95% center; background-size: 1em auto; }
	.othermenulist li .btn:hover{ background:#004EA2 url("/common/img/btn_arrow_white.svg") no-repeat 95% center; background-size: 1em auto; color:#fff; }
	body{ width: 100%; overflow-x: hidden; }

}