@charset "utf-8";
/* --------------------------------------------------
	reset
-------------------------------------------------- */
* { margin: 0; padding: 0; box-sizing: border-box;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
form, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0; padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

img{ vertical-align: bottom;}
ol, ul{ list-style: none;}
ol li ,
ul li{ list-style-type: none;}
figure { margin: 0;}


/* =============================================================================
   Forms
   ========================================================================== */
form { margin: 0;}
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
legend { border: 0;}
button,
input,
select,
textarea { font-size: 100%; margin: 0; vertical-align: baseline;}
button,
input { line-height: normal;}
button,
input[type="button"], 
input[type="reset"], 
input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"],
input[type="radio"] { box-sizing: border-box; padding: 0;}
input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}

button::-moz-focus-inner,
input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top;}
input[type="search"]:focus { outline: none;}

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


/*		font-style
-------------------------------------------------- */
body { color: #3e3e3e;
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
/*	font-family: "游ゴシック","Yu Gothic","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3", "メイリオ","Meiryo",sans-serif;*/
	font-size: 16px;
	*font-size:small;
	*font:x-small;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
input, textarea {font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}

.min {font-family: "游明朝", "Yu Mincho", "YuMincho", serif;}

::selection{ background: #feffaf; color: #000;}
::-moz-selection{ background: #feffaf; color: #000;}


a { text-decoration: underline;}
a:link   { }
a:visited{ }
a:hover  { }
a:active { }

em{ font-style: normal;}


/*		utility
-------------------------------------------------- */
.cf{ clear: both;}
.cf:after{ content: ''; display: block; clear: both;}

@media (max-width: 641px) {
}






/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box;
-webkit-user-select: none;
   -moz-user-select: none;
    -ms-user-select: none;
        user-select: none;

-webkit-touch-callout: none;
	-khtml-user-select: none;
	-ms-touch-action: pan-y;
  	  touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}

.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus { outline: none;}
.slick-list.dragging{ cursor: pointer; cursor: hand;}
.slick-slider .slick-track,
.slick-slider .slick-list{
-webkit-transform: translate3d(0, 0, 0);
   -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
     -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
}
.slick-track { position: relative; top: 0; left: 0; display: block;}
.slick-track:before,
.slick-track:after { display: table; content: '';}
.slick-track:after { clear: both;}
.slick-loading .slick-track { visibility: hidden;}
.slick-slide { display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide { float: right;}
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none;}
.slick-slide.dragging img { pointer-events: none;}
.slick-initialized .slick-slide { display: block;}
.slick-loading .slick-slide { visibility: hidden;}
.slick-vertical .slick-slide{ display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden { display: none;}

.slick-arrow{ position: absolute; top: 50%; width: 50px; height: 50px; background: #8f3946; border: solid 2px #fff; z-index: 100;
 -webkit-border-radius: 50%; border-radius: 50%; text-indent: -9999em; outline: none;
}
.slick-prev { left: 20px;}
.slick-next { right: 20px;}
.slick-arrow:before{ position: absolute; content: ''; display: block; width: 15px; height: 15px; top: 15px;}
.slick-prev:before { left: 18px; border-left: solid 2px #fff;border-bottom: solid 2px #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.slick-next:before { left: 10px; border-right: solid 2px #fff;border-top: solid 2px #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
@media (max-width: 481px) {
}



/*		Header
---------------------------------------------*/
#hd { position: fixed; top: 0; left: 0; width: 100%; background: #fff; z-index: 1000;}
#hd .inner-hd { display: flex; align-items: center; width: 100%; text-align: center;}
#hd .logo { width: 40.0%; text-indent: 25%;}
#hd .hd-area{ width: 13.0%;}
#hd .hd-tel { width: 20.0%;}
#hd .hd-btn { width: 630px; margin: 0 0 0 auto;}
#hd .hd-btn ul { font-size: 0; text-align: right;}
#hd .hd-btn ul li { display: inline-block;}
#hd .hd-btn ul li.hd-line { width: 28.5%;} 
#hd .hd-btn ul li.hd-search { width: 71.5%;} 
#hd .hd-btn ul li.hd-line img,
#hd .hd-btn ul li.hd-search img{ width: 100%;} 

#hd .logo img { width: 90%; max-width: 270px; }
#hd .hd-area div { width: 96%; margin: 0 auto; padding: 16px 0; background: #e31711; border-radius: 8px;
 color: #fff; font-size: 19px; font-weight: 700; line-height: 1.2;
}
#hd .hd-tel p.tel-no { margin-bottom: 10px; line-height: 1;}
#hd .hd-tel p.tel-no img { margin-right: 8px; vertical-align: middle;}
#hd .hd-tel p.tel-no span{ font-size: 26px; font-weight: 700; vertical-align: middle;}
#hd .hd-tel p.time { font-size: 13px;}
#hd .hd-tel p.sp-tel { display: none; text-align: right;}
#hd .hd-tel p.sp-tel img{ width: 100%; max-width: 390px;}
@media (max-width: 1401px) {
	#hd .logo { width: 23.0%; text-indent: 0;}
	#hd .hd-area{ width: 13.5%;}
	#hd .hd-tel { width: 18.7%;}
	#hd .hd-btn { width: 55.2%: max-width: 630px;}
}
@media (max-width: 1201px) {
	#hd .logo { width: 20.0%;}
	#hd .hd-area{ width: 15.0%;}
	#hd .hd-tel { width: 20.2%;}
	#hd .hd-area div { padding: 12px 0; font-size: 15px;}
	#hd .hd-tel p.tel-no img { width: 30px;}
	#hd .hd-tel p.tel-no span{ font-size: 21px;}
}
@media (max-width: 1001px) {
	#hd .hd-area{ width: 12.0%;}
	#hd .hd-tel { width: 23.2%;}
	#hd .hd-area div { padding: 8px 0;}
	#hd .hd-area div span { display: block;}
	#hd .hd-tel p.time { font-size: 11px;}
}
@media (max-width: 769px) {
	#hd .logo { width: 46.0%;}
	#hd .hd-tel { width: 64.0%;}
	#hd .hd-area,
	#hd .hd-btn { display: none;}
	#hd .hd-tel p.tel-no,
	#hd .hd-tel p.time { display: none;}
	#hd .hd-tel p.sp-tel { display: block;}
}
@media (max-width: 641px) {
}
@media (max-width: 481px) {
}



/*		KV
---------------------------------------------*/
#kv { background: #fdf9ee url(../img/bg-kv.png) no-repeat 100% 50%;}
#kv .inner-kv { width: 100%; max-width: 1080px; margin: 0 auto; padding: 145px 0 15px;}
#kv .inner-kv h2 { line-height: 1;}
#kv .inner-kv h2 img{ width: 100%; max-width: 790px;}
#kv .inner-kv h2 img.sp { display: none;}
@media (max-width: 1001px) {
	#kv .inner-kv { padding: 120px 0 15px;}
	#kv .inner-kv h2 img{ width: 75%;}
}
@media (max-width: 769px) {
	#kv { background: #fdf9ee;}
	#kv .inner-kv { padding: 120px 0 0;}
	#kv .inner-kv h2 img.pc { display: none;}
	#kv .inner-kv h2 img.sp { display: block; width: 100%;}
}
@media (max-width: 641px) {
	#kv .inner-kv { padding: 100px 0 0;}
}
@media (max-width: 481px) {
	#kv .inner-kv { padding: 60px 0 0;}
}


/*		common-parts of CSS
---------------------------------------------*/
h2.stl { margin-bottom: 50px; font-size: 40px; line-height: 1.2; text-align: center;}

.why { position: relative; width: 100%; max-width: 780px; margin: 0 auto;}
.why:after { content: ''; display: block; position: absolute;}
.why h3 { line-height: 1.4; text-align: center;}
.why h3 br { display: none;}
.why h3 span { display: block; padding: 32px 0px 38px; background: #ffd9d8; border-radius: 80px; color: #e31711; font-size: 28px;}
@media (max-width: 1001px) {
	h2.stl { font-size: 32px;}
}
@media (max-width: 769px) {
	h2.stl { margin-bottom: 30px;}
	.why h3 br { display: block;}
	.why h3 span { padding: 22px 0px 28px; font-size: 24px;}
}
@media (max-width: 481px) {
	h2.stl { font-size: 21px;}
	.why h3 span { font-size: 18px;}
}

.btn-line a { background: linear-gradient(#3ac527, #34b01d); border-radius: 5px; box-shadow: 0 3px 0 #18820a;}
.btn-search a { background: linear-gradient(#ffae00, #f99003); border-radius: 5px; box-shadow: 0 3px 0 #d85c00;}
.btn-line a:hover  { opacity: 0.9; box-shadow: 0 1px 0 #18820a;}
.btn-search a:hover { opacity: 0.9; box-shadow: 0 1px 0 #d85c00;}
@media (max-width: 769px) {
	.btn-line a,
	.btn-line a:hover { box-shadow: 0 6px 0 #18820a;}
	.btn-search a,
	.btn-search a:hover { box-shadow: 0 6px 0 #d85c00;}
}

.cvr { padding-top: 30px; border-top: solid 1px #dbd6c3; background: linear-gradient(#fff1e8, #fff);}
.cvr h3 { text-align: center;}
.cvr h3 img { width: 100%; max-width: 1200px; }
.cvr h3 img.sp { display: none;}
.cvr .btn-bloc { padding: 28px 0; background: #e31711;}
.cvr .btn-bloc ul { width: 92%; max-width: 1080px; margin: 0 auto; font-size: 0; text-align: center;}
.cvr .btn-bloc ul li { display: inline-block;}
.cvr .btn-bloc ul li.btn-tel a { display: none;}
.cvr .btn-bloc ul li.btn-line a { display: block;}
.cvr .btn-bloc ul li.btn-search a { display: block;}
.cvr .btn-bloc ul li.btn-line a img.sp,
.cvr .btn-bloc ul li.btn-search a img.sp { display: none;}
.cvr .btn-bloc ul.btn-ptn-3 li.btn-line { margin: 0 20px;}
.cvr .btn-bloc ul.btn-ptn-2 li.btn-tel,
.cvr .btn-bloc ul.btn-ptn-2 li.btn-line { width: 50%; margin: 0;}
.cvr .btn-bloc ul.btn-ptn-2 li.btn-tel span { display: block; width: 95%; margin: 0;}
.cvr .btn-bloc ul.btn-ptn-2 li.btn-tel span img{ width: 100%;}
.cvr .btn-bloc ul.btn-ptn-2 li.btn-line a { display: block; width: 95%; margin: 0 0 0 auto;}
.cvr .btn-bloc ul.btn-ptn-2 li.btn-line a img{ width: 100%;}
@media (max-width: 769px) {
	.cvr h3 img.pc { display: none;}
	.cvr h3 img.sp { display: block; max-width: 750px; margin: 0 auto;}
	.cvr .btn-bloc ul li { display: block; max-width: 690px; margin: 0 auto 20px !important;}
	.cvr .btn-bloc ul li:last-child{ margin: 0 auto !important;}
	.cvr .btn-bloc ul li.btn-tel span,
	.cvr .btn-bloc ul.btn-ptn-2 li.btn-tel span { display: none;}
	.cvr .btn-bloc ul li.btn-tel a { display: block; width: 100%; border-radius: 5px; border: solid 1px #c9c9c9; box-shadow: 0 6px 0 #b5120d; overflow: hidden;}
	.cvr .btn-bloc ul li.btn-tel a img{ width: 100%;}
	.cvr .btn-bloc ul li.btn-line a img.pc,
	.cvr .btn-bloc ul li.btn-search a img.pc { display: none;}
	.cvr .btn-bloc ul li.btn-line a img.sp,
	.cvr .btn-bloc ul li.btn-search a img.sp { display: block; width: 100%;}
	
	.cvr .btn-bloc ul.btn-ptn-2 li.btn-tel  { width: 100%; margin: 0 auto 15px;}
	.cvr .btn-bloc ul.btn-ptn-2 li.btn-line { width: 100%; margin: 0 auto;}
	.cvr .btn-bloc ul.btn-ptn-2 li.btn-line a { width: 100%; margin: 0 auto;}
}
@media (max-width: 481px) {
	.cvr { padding-top: 20px;}
}



/*		parts of CSS
---------------------------------------------*/
.thanks { position: relative; padding: 25px 0; background: #e31711; overflow: hidden;}
.thanks .result { position: absolute; left: 0; top: 0; width: 530px; height: 200px; background: #e31711; z-index: 200;}
.thanks .result .box { position: relative; width: 100%; padding-top: 9.5%;}
.thanks .result .box p { color: #fff; font-size: 21px; font-weight: 700; line-height: 1; text-align: center;}
.thanks .result .box p.monthly { font-size: 26px;}
.thanks .result .box p.monthly em{ font-size: 60px;}
.thanks .slide .th { width: 240px; }
.thanks .slide .th img{ width: 90%; max-width: 240px;}
@media (max-width: 1401px) {
.thanks .result .box { padding: 60px 0 80px;}
}
@media (max-width: 1201px) {
	.thanks .result { width: 400px;}
	.thanks .result .box { padding: 50px 0;}
	.thanks .result .box p { font-size: 18px;}
	.thanks .result .box p.monthly { font-size: 24px;}
	.thanks .result .box p.monthly em{ font-size: 50px;}
}
@media (max-width: 1001px) {
}
@media (max-width: 769px) {
	.thanks .result { position: relative; width: 100%; height: auto;}
	.thanks .result .box { padding: 0 0 20px;}
}
@media (max-width: 481px) {
	.thanks { padding: 15px 0;}
	.thanks .result .box p { font-size: 18px;}
	.thanks .result .box p.monthly { font-size: 21px;}
	.thanks .result .box p.monthly em{ font-size: 40px;}
}


#intro { background: #fff9e3;}
#intro .inner { width: 94%; max-width: 1200px; margin: 0 auto; padding: 100px 0;}
#intro h2 span.line { display: block; font-size: 50px; font-weight: 700;}
#intro h2 em { color: #e31711;}
#intro .why { margin: 0 auto 60px;}
#intro .why:after { width: 150px; height: 206px; right: -110px; bottom: -5px;
 background: url(../img/illust-1.png) no-repeat 50% 0; background-size: 100% 100%;
}
#intro ul { font-size: 0; text-align: center;}
#intro ul li { display: inline-block; width: 33%; margin: 0 auto 30px; vertical-align: top;}
#intro ul li dl { width: 94%; max-width: 330px; margin: 0 auto;}
#intro ul li dl dt { margin: 0 auto 20px;}
#intro ul li dl dt span { display: block; width: 160px; height: 160px; margin: 0 auto; padding-top: 20px; background: #fff; border-radius: 50%; text-align: center;}
#intro ul li dl dd { color: #333;}
#intro ul li dl dd.topic { height: 70px; margin-bottom: 10px; padding-top: 15px; font-size: 28px; line-height: 1.2;}
#intro ul li dl dd.topic.row2 { padding-top: 0px;}
#intro ul li dl dd.txt { font-size: 16px; text-align: left; }
@media (max-width: 1001px) {
	#intro h2 span { display: block;}
	#intro h2 span.line { display: block; font-size: 40px;}
	#intro .why:after { width: 100px; height: 137px; right: -60px;}
}
@media (max-width: 769px) {
	#intro .inner { padding: 60px 0;}
	#intro .why:after { right: -8px;}
	#intro ul li { width: 50%;}
	#intro ul li dl dd.topic { height: auto; padding-top: 0;}
}
@media (max-width: 481px) {
	#intro .inner { padding: 40px 0;}
	#intro h2 span.line { font-size: 23px;}
	#intro .why { margin: 0 auto 40px;}
	#intro .why:after { width: 70px; height: 96px;}
	#intro .why h3 span { padding: 15px 50px 15px 10px;}
	#intro ul li { margin: 0 auto 20px;}
	#intro ul li dl dt span { width: 100px; height: 100px;}
	#intro ul li dl dt span img{ width: 60%;}
	#intro ul li dl dd.topic { font-size: 16px;}
	#intro ul li dl dd.txt { font-size: 12px;}
}

#cost { background: #fffbeb;}
#cost .inner { width: 94%; max-width: 1200px; margin: 0 auto; padding: 100px 0;}
#cost .why { margin: 0 auto 40px;}
#cost .why:after { width: 140px; height: 230px; left: -80px; top: -90px;
 background: url(../img/illust-2.png) no-repeat 50% 0; background-size: 100% 100%;
}
#cost p.read { margin-bottom: 15px; font-size: 40px; font-weight: 700; line-height: 1.2; text-align: center;}
#cost p.read br.sp { display: none;}
#cost p.read span { display: block; padding-top: 5px; color: #e31711; font-size: 60px;}
#cost figure { width: 100%; max-width: 760px; margin: 0 auto 40px;}
#cost figure img { width: 100%;}
#cost p.result { margin-bottom: 60px; color: #e31711; font-size: 60px; font-weight: 700; line-height: 1.2; text-align: center;}
#cost p.result span em{ font-size: 120px;}
#cost .point { position: relative; width: 100%; max-width: 880px; margin: 0 auto; padding-top: 28px;}
#cost .point:before,
#cost .point:after { content: ''; display: block; width: 0; height: 0; border: solid 14px transparent; position: absolute; left: 32%;}
#cost .point:before{ top: 0; border-right: solid 12px #ffc600; border-bottom: solid 16px #ffc600;}
#cost .point:after{ top: 5px; margin-left: -2px; border-right: solid 12px #fff; border-bottom: solid 16px #fff;}
#cost .point .box { position: relative; padding: 30px 40px; background: #fff; border: solid 2px #ffc600; border-radius: 10px;}
#cost .point .box h4 { position: absolute; left: -90px; top: -30px; 
 display: block; width: 120px; height: 120px; line-height: 120px; background: #ffc600; border-radius: 50%;
 font-family: 'Oswald'; font-size: 26px; text-align: center;
}
#cost .point .box p { color: #333; font-size: 26px;}
#cost .point .box p span { display: inline-block; padding: 0 4px; background: #ffc600; }
#cost .point .box:after { content: ''; display: block; width: 172px; height: 210px;
 background: url(../img/illust-3.png) no-repeat 50% 0; background-size: 100% 100%;
 position: absolute; right: -70px; bottom: -10px;
}
@media (max-width: 1001px) {
	#cost .why:after { width: 100px; height: 164px; left: -40px; top: -50px;}
	#cost p.result { font-size: 45px;}
	#cost p.result span em{ font-size: 80px;}
	#cost .point .box { padding: 30px 80px 30px 160px;}
	#cost .point .box h4 { top: 50%; left: 20px; margin-top: -60px;}
	#cost .point .box:after { width: 140px; height: 172px; right: -10px;}
}
@media (max-width: 769px) {
	#cost .why:after { left: 0; top: -30px;}
	#cost p.read { font-size: 30px;}
	#cost p.read br.sp { display: block;}
	#cost p.read span { font-size: 40px;}
	#cost p.result { margin-bottom: 30px;}
	#cost p.result span { display: block; font-size: 52px;}
	#cost .point .box { padding: 30px 30px 30px 160px;}
	#cost .point .box p br { display: none;}
	#cost .point .box:after{ content: none;}
}
@media (max-width: 641px) {
	#cost .point .box p { font-size: 21px;}
}
@media (max-width: 481px) {
	#cost .inner { padding: 60px 0;}
	#cost .why:after { width: 80px; height: 130px; top: -30px;}
	#cost .why h3 span { padding: 15px 10px 15px 50px;}
	#cost p.read { font-size: 18px;}
	#cost p.read span { font-size: 28px;}
	#cost p.result { margin-bottom: 10px; font-size: 30px;}
	#cost p.result span { font-size: 40px;}
	#cost p.result span em{ font-size: 60px;}
	#cost .point .box { padding: 20px 10px 20px 90px;}
	#cost .point .box h4 { width: 70px; height: 70px; line-height: 70px; left: 10px; margin-top: -35px; font-size: 16px;}
	#cost .point .box p { font-size: 15px;}
}

#case .inner { width: 94%; max-width: 1080px; margin: 0 auto; padding: 70px 0;}
#case .case-list-inner { display: flex; justify-content: flex-end; flex-wrap: wrap; width: 100%;}
#case .box { width: 48%; margin: 0 auto 60px;}
#case .box figure { width: 94%; max-width: 510px; margin: 0 auto 20px;}
#case .box figure img { width: 100%;}
#case .box ul { width: 94%; max-width: 510px; margin: 0 auto; border-top: solid 1px #e2e2e2;}
#case .box ul li { border-bottom: solid 1px #e2e2e2;}
#case .box ul li dl { display: table; width: 100%;}
#case .box ul li dl dt,
#case .box ul li dl dd { display: table-cell; vertical-align: middle; padding: 10px 20px;}
#case .box ul li dl dt { width: 30%; background: #fff5f5;}
#case .box ul li dl dd { width: 70%;}
@media (max-width: 769px) {
	#case .case-list { overflow-x: scroll; padding-bottom: 20px;}
	#case .case-list::-webkit-scrollbar { height: 6px;}
	#case .case-list::-webkit-scrollbar-track { margin: 0 2px; background: #ccc; border-radius: 5px;}
	#case .case-list::-webkit-scrollbar-thumb { border-radius: 5px; background: #e31711;}
	#case .case-list .case-list-inner { display: flex; justify-content:space-between; width: calc(560px * 8);}

	#case .box { width: 75%; max-width: 540px; margin: 0 auto;}
	#case .box:last-of-type{ margin-right: 0;}
}
@media (max-width: 641px) {
	#case .case-list .case-list-inner { width: calc(540px * 8);}
	#case .box { width: 80%; max-width: 520px;}
}
@media (max-width: 481px) {
	#case .inner { padding: 40px 0;}
	#case .case-list .case-list-inner { width: calc(340px * 8);}
	#case .box { max-width: 320px;}
	#case .box ul li dl dt,
	#case .box ul li dl dd { padding: 8px 10px; font-size: 13px;}
	#case .box ul li dl dt { width: 25%;}
	#case .box ul li dl dd { width: 75%;}
}



#voice .inner { width: 94%; max-width: 1080px; margin: 0 auto; padding: 70px 0;}
#voice .bloc { display: flex; margin: 0 auto 50px;}
#voice .bloc .pht { width: 22%;}
#voice .bloc .txt { width: 78%; padding-left: 25px;}
#voice .bloc .pht figure { width: 96%; max-width: 200px;}
#voice .bloc .pht figure img { width: 100%; max-width: 200px; border-radius: 8px; overflow: hidden;}
#voice .bloc .pht figure figcaption { display: none;}
#voice .bloc .txt .box { position: relative; width: 100%; padding: 30px; border: solid 3px #f0f0f0; border-radius: 10px;}
#voice .bloc .txt .box:before,
#voice .bloc .txt .box:after { content: ''; display: block; width: 0; height: 0; position: absolute; border: solid 14px transparent;}
#voice .bloc .txt .box:before{ left: -36px; top: 60px; border-top: solid 8px #f2f2f2; border-right: solid 20px #f2f2f2;}
#voice .bloc .txt .box:after { left: -25px; top: 63px; border-top: solid 8px #fff; border-right: solid 20px #fff;}
#voice .bloc .txt .box h3 { margin-bottom: 15px; color: #e31711; font-size: 24px;}
#voice .bloc .txt .box p.name { margin-bottom: 10px; color: #333; font-size: 18px; font-weight: 700; }
@media (max-width: 769px) {
	#voice .voice-list { overflow-x: scroll; padding-bottom: 20px;}
	#voice .voice-list::-webkit-scrollbar { height: 6px;}
	#voice .voice-list::-webkit-scrollbar-track { margin: 0 2px; background: #ccc; border-radius: 5px;}
	#voice .voice-list::-webkit-scrollbar-thumb { border-radius: 5px; background: #e31711;}
	#voice .voice-list .voice-list-inner { display: flex;justify-content:space-between; width: calc(560px * 5);}

	#voice .bloc { display: block; width: 75%; max-width: 540px; margin: 0 auto;}
	#voice .bloc .pht { width: 100%;}
	#voice .bloc .txt { width: 100%; padding-left: 0px; padding-top: 25px;}
	#voice .bloc .pht figure { width: 100%; max-width: 100%; text-align: center;}
	#voice .bloc .pht figure figcaption { display: block; text-align: center;}
	#voice .bloc .pht figure figcaption span{ display: block;}
	#voice .bloc .txt .box { padding: 20px;}
	#voice .bloc .txt .box:before,
	#voice .bloc .txt .box:after { border: solid 16px transparent;}
	#voice .bloc .txt .box:before{ left: 100px; top: -38px; border-right: solid 10px #f2f2f2; border-bottom: solid 22px #f2f2f2;}
	#voice .bloc .txt .box:after { left: 97px; top: -28px; border-right: solid 10px #fff; border-bottom: solid 22px #fff;}
	#voice .bloc .txt .box h3 { margin-bottom: 10px;}
	#voice .bloc .txt .box p.name { display: none;}
}
@media (max-width: 641px) {
	#voice .voice-list .voice-list-inner { width: calc(500px * 5);}
	#voice .bloc { width: 80%; max-width: 540px;}
}
@media (max-width: 481px) {
	#voice .voice-list .voice-list-inner { width: calc(340px * 5);}
	#voice .bloc { max-width: 320px;}
	#voice .bloc .txt .box:before{ left: 60px;}
	#voice .bloc .txt .box:after { left: 57px;}
	#voice .bloc .txt .box h3 { font-size: 21px;}
	#voice .bloc .txt .box p { font-size: 13px;}
}


#flow { background: #fffbeb;}
#flow .inner { width: 94%; max-width: 1080px; margin: 0 auto; padding: 100px 0;}
#flow p { margin: 0 auto 10px; font-size: 24px; font-weight: 700; text-align: center;}
#flow p br.sp { display: none;}
#flow p span.note { font-size: 16px; font-weight: 100;}
#flow p.caution { margin: 0 auto 50px; color: #e31711; font-size: 28px;}
#flow ul { font-size: 0; text-align: center;}
#flow ul li { display: inline-block; width: 25%; vertical-align: top;
 padding-right: 30px;
 background: url(../img/arw.png) no-repeat 98% 100px;
}
#flow ul li:last-child{ padding-right: 0px; background: none;}
#flow ul li dl { width: 94%; max-width: 225px;}
#flow ul li dl dt { margin: 0 auto 10px; color: #e31711; font-size: 20px; font-weight: 700; line-height: 1;}
#flow ul li dl dd.pht { margin: 0 auto 20px;}
#flow ul li dl dd.pht img{ width: 100%; max-width: 240px;}
#flow ul li dl dd.txt { font-size: 16px; text-align: justify;}
#flow ul li dl dd.txt span{ display: block; margin: 0 auto 20px; font-size: 18px; font-weight: 700; text-align: center;}
@media (max-width: 1001px) {
	#flow p { font-size: 18px;}
	#flow p span.note { font-size: 14px;}
	#flow p.caution { font-size: 24px;}
	#flow ul { padding-left: 10px;}
	#flow ul li { padding-right: 20px;}
	#flow ul li:last-child{ padding-right: 10px; padding-left: 5px;}
}
@media (max-width: 769px) {
	#flow .inner { padding: 60px 0;}
	#flow p { text-align: justify;}
	#flow p.caution { text-align: center;}
	#flow ul li { display: block; width: 100%; margin: 0 auto 30px; padding-right: 0px; background: url(../img/arw-v.png) no-repeat 5% 80%;}
	#flow ul li:last-child { margin: 0 auto;}
	#flow ul li dl { display: table; width: 100%; max-width: 100%;}
	#flow ul li dl dt,
	#flow ul li dl dd { display: table-cell; vertical-align: top;}
	#flow ul li dl dt { width: 12%; margin: 0 auto;}
	#flow ul li dl dt em { display: block;}
	#flow ul li dl dd.pht { width: 38%; margin: 0 auto;}
	#flow ul li dl dd.txt { width: 50%; padding-left: 10px;}
	#flow ul li dl dd.txt span{ margin: 0 auto 10px; text-align: left;}
}
@media (max-width: 641px) {
	#flow p.caution span { display: block;}
}
@media (max-width: 481px) {
	#flow p { font-size: 16px;}
	#flow p span.note { font-size: 12px;}
	#flow p.caution { font-size: 21px;}
	#flow ul li { background-size: auto 40px;}
	#flow ul li dl dt { font-size: 13px;}
	#flow ul li dl dt em{ font-size: 18px;}
	#flow ul li dl dd.txt { font-size: 13px;}
	#flow ul li dl dd.txt span{ font-size: 16px;}
}


#faq .inner { width: 94%; max-width: 1080px; margin: 0 auto; padding: 70px 0;}
#faq ul li { margin-bottom: 40px;}
#faq ul li:last-child { margin-bottom: 0px;}
#faq ul li dl dt { position: relative; margin-bottom: 25px; padding: 25px 20px; padding-left: 80px; background: #fff5f5; border-radius: 6px;
 color: #333; font-size: 18px; font-weight: 700;
}
#faq ul li dl dt span { position: absolute; left: 20px; top: 50%; margin-top: -20px;
 display: block; width: 40px; height: 40px; line-height: 40px; background: #e31711;
 color: #fff; font-size: 24px; text-align: center;
}
@media (max-width: 769px) {
	#faq .inner { padding: 60px 0;}
}
@media (max-width: 481px) {
	#faq .inner { padding: 40px 0;}
	#faq ul li dl dt { margin-bottom: 15px; padding: 10px; padding-left: 60px; font-size: 16px;}
	#faq ul li dl dt span { left: 10px; font-size: 20px;}
	#faq ul li dl dd{ font-size: 14px;}
	#faq ul li { margin-bottom: 20px;}
}


#message { background: #fdf9ee;}
#message .inner { width: 94%; max-width: 1080px; margin: 0 auto; padding: 100px 0;}
#message .ctn { display: flex;}
#message .ctn .pht { width: 24%;}
#message .ctn .txt { width: 76%; padding-left: 40px;}
#message .ctn .pht figure { width: 96%; max-width: 250px;}
#message .ctn .pht figure img { width: 100%; max-width: 250px; margin-bottom: 15px;}
#message .ctn .pht figure figcaption{ font-size: 18px; line-height: 1.8; text-align: center;}
#message .ctn .txt .box { position: relative; width: 100%; padding: 50px; background: #fff; border: solid 2px #e31711; border-radius: 10px;}
#message .ctn .txt .box:before,
#message .ctn .txt .box:after { content: ''; display: block; width: 0; height: 0; position: absolute; border: solid 16px transparent;}
#message .ctn .txt .box:before{ left: -36px; top: 100px; border-top: solid 12px #e31711; border-right: solid 20px #e31711;}
#message .ctn .txt .box:after { left: -30px; top: 102px; border-top: solid 12px #fff; border-right: solid 20px #fff;}
#message .ctn .txt .box h3{ margin-bottom: 30px; color: #e31711; font-size: 34px;}
#message .ctn .txt .box p { line-height: 2.2; }
@media (max-width: 769px) {
	#message .inner { padding: 60px 0;}
	#message .ctn { display: block;}
	#message .ctn .pht { width: 100%;}
	#message .ctn .txt { width: 100%; padding-left: 0px; padding-top: 40px;}
	#message .ctn .pht figure { max-width: 100%; margin: 0 auto; text-align: center;}
	#message .ctn .pht figure img { margin-bottom: 8px;}
	#message .ctn .txt .box { padding: 30px; background: #fff;}
	#message .ctn .txt .box:before,
	#message .ctn .txt .box:after { border: solid 16px transparent;}
	#message .ctn .txt .box:before{ left: 150px; top: -38px; border-right: solid 12px #e31711; border-bottom: solid 20px #e31711;}
	#message .ctn .txt .box:after { left: 148px; top: -32px; border-right: solid 12px #fff; border-bottom: solid 20px #fff;}
	#message .ctn .txt .box h3{ margin-bottom: 20px; text-align: center;}
	#message .ctn .txt .box p { line-height: 1.75;}
}
@media (max-width: 481px) {
	#message .inner { padding: 40px 0;}
	#message .ctn .pht figure figcaption{ font-size: 15px;}
	#message .ctn .txt .box { padding: 20px;}
	#message .ctn .txt .box:before{ left: 60px;}
	#message .ctn .txt .box:after { left: 58px;}
	#message .ctn .txt .box h3{ margin-bottom: 10px; font-size: 24px;}
	#message .ctn .txt .box p { font-size: 13px;}
}


#contact { position: relative;}
#contact #form{ position: absolute; top: -120px;}
#contact:before{ content: ''; position: absolute; width: 100%; height: 180px; background: #e31711;}
#contact .inner { position: relative; width: 92%; max-width: 1080px; margin: 0 auto; padding: 0 50px 80px; background: #fff; border-radius: 10px; box-shadow: 0 2px 6px #aaa;}
#contact .read { width: 94%; margin: 0 auto; padding: 0 0px 50px; background: url(../img/lady.jpg) no-repeat 100% 100%;}
#contact .read .ttl{ padding: 50px 0 40px;}
#contact .read .ttl h2 { font-size: 44px;}
#contact .entryBloc ul { width: 100%; margin: 0 auto 100px; border-top: solid 1px #e2e2e2;}
#contact .entryBloc ul li { border-bottom: solid 1px #e2e2e2;}
#contact .entryBloc ul li dl { display: table; width: 100%;}
#contact .entryBloc ul li dl dt,
#contact .entryBloc ul li dl dd { position: relative; display: table-cell; padding: 20px; vertical-align: middle;}
#contact .entryBloc ul li dl dt { width: 25%; background: #fff5f5; font-size: 16px; font-weight: 700;}
#contact .entryBloc ul li dl dt span.must { display: block; width: 38px; height: 18px; line-height: 18px; background: #e31711;
 position: absolute; right: 15px; top: 50%; margin-top: -9px; 
 color: #fff; font-size: 14px; font-weight: 100; text-align: center;
}
#contact .entryBloc ul li dl dd { width: 75%;}
#contact .entryBloc ul li dl dd .checkError { position: relative;}
#contact .entryBloc ul li dl dd input[type="text"],
#contact .entryBloc ul li dl dd input[type="tel"],
#contact .entryBloc ul li dl dd input[type="email"] { width: 100%; padding: 5px; background: #efefef; border: solid 1px #dcdcdc; border-radius: 4px;}
#contact .entryBloc ul li dl dd span.w1 { position: relative; display: inline-block; width: 100px; padding: 5px 0;}
#contact .entryBloc ul li dl dd span.w2 { position: relative; display: inline-block; width: 140px; padding: 5px 0;}
#contact .entryBloc ul li dl dd input[type="radio"]{ position: absolute; left: 2px; top: 8px; z-index: 1;}
#contact .entryBloc ul li dl dd input.radio1 + label,
#contact .entryBloc ul li dl dd input.radio2 + label{ padding-left: 24px; position:relative; line-height: 1;}
#contact .entryBloc ul li dl dd input.radio1 + label::before,
#contact .entryBloc ul li dl dd input.radio2 + label::before{ content: ""; display: block; position: absolute; top: 3px; left: 0;
 width: 17px; height: 17px; background: #fff; border: 1px solid #999; border-radius: 50%; z-index: 2;}
#contact .entryBloc ul li dl dd input.radio1:checked + label::after,
#contact .entryBloc ul li dl dd input.radio2:checked + label::after{ content: ""; display: block; position: absolute; top: 7px; left: 4px;
 width: 11px; height: 11px; background: #e31711; border-radius: 50%; z-index: 3;}

#contact .entryBloc ul li dl dd textarea { width: 100%; height: 160px; padding: 5px; background: #efefef; border: solid 1px #dcdcdc; border-radius: 4px;}
#contact .entryBloc .send { position: relative; width: 80%; max-width: 480px; height: 80px; margin: 0 auto;
 background: linear-gradient(#ffae00, #f99003); border-radius: 8px; box-shadow: 0 3px 0 #d86100;
}
#contact .entryBloc .send:after{ content: ''; display: block; width: 10px; height: 10px;
 border-top: solid 2px #fff; border-right: solid 2px #fff;
 position: absolute; right: 25px; top: 50%; margin-top: -5px; transform: rotate(45deg);
}
#contact .entryBloc .send input[type="submit"] { position: relative; z-index: 2; width: 100%; height: 80px; background: rgba(255,255,255,0); border: none;
 color: #fff; font-size: 26px; font-weight: 700;
}
#contact .entryBloc .send input[type="submit"]:hover { background: rgba(255,255,255,0.2);}

/* フォーム部分 */
.entryBloc ul li label.error {
	position: absolute; top: -30px; left: -10px;
	padding: 5px 8px;
	background: #d00; border-radius: 5px;
	color: #fff; font-size: 12px;
	opacity: 0;
	animation: .5s showError linear forwards .2s;
}
.entryBloc ul li label.error:before{ content: ''; display: block; width: 8px; height: 8px; background: #d00;
	transform: rotate(45deg);
	position: absolute; bottom: -4px; left: 20px;
}
@keyframes showError{
	100%{ opacity: 1;}
}

@media (max-width: 769px) {
	#contact .inner { padding: 0 30px 30px;}
	#contact .read { padding: 0 0px 20px; background: none;}
	#contact .read .ttl{ padding: 60px 0; background: url(../img/lady.jpg) no-repeat 100% 100%; background-size: 160px auto;}
	#contact .read .ttl h2 { font-size: 36px;}
	#contact .entryBloc ul { width: 100%; margin: 0 auto 30px;}

	#contact .entryBloc ul li dl dt,
	#contact .entryBloc ul li dl dd { display: block; width: 100%;}
	#contact .entryBloc ul li dl dt { padding: 10px; background: #fff;}
	#contact .entryBloc ul li dl dd { padding: 0px 0px 10px;}
	#contact .entryBloc ul li dl dt span.must { display: inline-block; position: relative; right: auto; top: auto; margin-top: 0; margin-left: 10px;}
}
@media (max-width: 481px) {
	#contact .inner { padding: 0 15px 20px;}
	#contact .read { width: 100%; padding: 0 0 10px;}
	#contact .read .ttl{ padding: 50px 0; background-size: 120px auto;}
	#contact .read .ttl h2 { font-size: 21px;}
	#contact .read p{ font-size: 11px;}
	#contact .entryBloc ul li dl dt { font-size: 14px;}
	#contact .entryBloc ul li dl dt span.must { width: 32px; font-size: 10px;}
	#contact .entryBloc ul li dl dd span.w1,
	#contact .entryBloc ul li dl dd span.w2 { width: 100px; font-size: 14px;}
	#contact .entryBloc ul li dl dd input.radio1 + label::before,
	#contact .entryBloc ul li dl dd input.radio2 + label::before{ top: 2px;}
	#contact .entryBloc ul li dl dd input.radio1:checked + label::after,
	#contact .entryBloc ul li dl dd input.radio2:checked + label::after{ top: 6px;}
	#contact .entryBloc ul li dl dd textarea { height: 100px;}
	#contact .entryBloc .send { height: 60px;}
	#contact .entryBloc .send input[type="submit"] { height: 60px; font-size: 16px;}
}



#conpany .inner{ width: 92%; max-width: 1080px; margin: 0 auto; padding: 140px 0 80px;}
#conpany h2 { margin-bottom: 40px; font-size: 30px; font-weight: 400; text-align: center;}
#conpany ul { border-top: solid 1px #d9d9d9;}
#conpany ul li { border-bottom: solid 1px #d9d9d9;}
#conpany ul li dl { display: table; width: 100%;}
#conpany ul li dl dt,
#conpany ul li dl dd { display: table-cell; vertical-align: middle; padding: 20px; color: #464646;}
#conpany ul li dl dt { width: 20%; background: #f9f9f9;}
#conpany ul li dl dd { width: 80%;}
#conpany ul li dl dd a { display: none;}
@media (max-width: 769px) {
	#conpany .inner{ padding: 60px 0;}
}
@media (max-width: 481px) {
	#conpany h2 { margin-bottom: 20px; font-size: 24px;}
	#conpany ul li dl dt,
	#conpany ul li dl dd { padding: 8px 10px; font-size: 12px;}
	#conpany ul li dl dt { width: 20%;}
	#conpany ul li dl dd { width: 80%;}
	#conpany ul li dl dd span { display: none;}
	#conpany ul li dl dd a { display: inline;}
}


.pagetop { position: fixed; right: 4%; bottom: 80px; width: 70px; height: 70px;}
.pagetop a { position: relative; display: block; width: 100%; height: 100%; background: #e31711; border-radius: 50%; transition: 0.3s linear;}
.pagetop a:before{ content: ''; display: block; width: 20px; height: 20px; border-top: solid 2px #fff; border-left: solid 2px #fff;
 position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -5px; transform: rotate(45deg)
}
.pagetop a:hover{ opacity: 0.85;}

.sp-fix { display: none; position: fixed; left: 0; bottom: -300px; width: 100%; padding: 10px 0 15px; background: #fff2f2; z-index: 99; transition: 0.4s ease}
.sp-fix ul { width: 94%; margin: 0 auto; font-size: 0; text-align: center;}
.sp-fix ul li { display: inline-block; width: 50%;}
.sp-fix ul li a { display: block; width: 96%; max-width: 328px; margin: 0 auto;}
.sp-fix ul li a img { width: 100%;}

#ft { padding-bottom: 80px;}
#ft p { text-align: center;}
#ft p small { color: #999; font-size: 10px;}

@media (max-width: 769px) {
	.pagetop { bottom: 140px;}
	.sp-fix { display: block;}
	.sp-fix.fixed{ bottom: 0;}
	#ft { padding-bottom: 140px;}
}
@media (max-width: 481px) {
	.pagetop { bottom: 100px; width: 50px; height: 50px;}
	.pagetop a:before{ width: 15px; height: 15px; margin-left: -8px;}
	#ft { padding-bottom: 100px;}
}


.send-msg { width: 92%; margin: 0 auto; padding: 200px 0 100px; text-align: center;}
.send-msg p { margin: 0 auto 80px; font-size: 18px;}
.send-msg .btn { position: relative; width: 80%; max-width: 480px; margin: 0 auto;}
.send-msg .btn a { display: block; height: 60px; line-height: 60px; margin: 0 auto;
 background: linear-gradient(#ffae00, #f99003); border-radius: 8px; box-shadow: 0 3px 0 #d86100;
 color: #fff; font-size: 18px; text-decoration: none;
}
.send-msg .btn a:hover{ opacity: 0.9;}
@media (max-width: 641px) {
	.send-msg p span { display: block;}
}
@media (max-width: 481px) {
	.send-msg p { font-size: 15px;}
	.send-msg .btn a { height: 50px; line-height: 50px; font-size: 16px;}
}


