@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;}
ul,ol { list-style: none;}
ul li, ol 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 {
	font-family: 'Noto Sans JP',"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
/*	font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", 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 { color:#002159; text-decoration: underline;}
a:link   { color:#002159;}
a:visited{ color:#002159;}
a:hover  { color:#002159;}
a:active { color:#002159;}

em{ font-style: normal;}


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

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


#contact 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;
}
#contact 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: 481px) {
}

#hd { position: absolute; left: 0; width: 100%;}
#hd .inner-hd { display: flex; justify-content: space-between; align-items: center; width: 94%; margin: 0 auto; padding-top: 30px;}
#hd .logo { width: 30%; max-width: 250px;}
#hd .nav { width: 62%; max-width: 600px;}
#hd .logo h1 a:hover { opacity: 0.8;}
#hd .logo h1 img { width: 100%;}
#hd .nav ul { font-size: 0; line-height: 1.2; text-align: center;}
#hd .nav ul li { display: inline-block; vertical-align: middle;}
#hd .nav ul li.tel { width: 45%;}
#hd .nav ul li.contact { width: 40%; padding: 0 15px;}
#hd .nav ul li.lang { width: 15%; padding-left: 15px; border-left: solid 1px #c7c7c7; font-size: 15px; font-weight: 700;}
#hd .nav ul li img { width: 96%;}
#hd .nav ul li.contact a { display: block; width: 100%; max-width: 200px; margin: 0 auto; padding: 14px 0;
 background: linear-gradient(#1fb256, #3fc572); border-radius: 8px;
 color: #fff; font-size: 18px; font-weight: 700; letter-spacing: 0.074rem; text-align: center; text-decoration: none;
}
#hd .nav ul li a:hover { opacity: 0.8;}
#hd .nav ul li.lang ul { padding-top: 4px;}
#hd .nav ul li.lang ul li { display: inline-block; width: 50%; padding: 0px; font-size: 16px; border: none;}
#hd .nav ul li.lang ul li span,
#hd .nav ul li.lang ul li a { display: block; width: 30px; height: 30px; margin: 0 auto; line-height: 30px; border-radius: 5px;}
#hd .nav ul li.lang ul li span { background: #313131; color: #fff;}
#hd .nav ul li.lang ul li a { background: #c7c7c7; color: #7b7b7b; text-decoration: none;}
#hd .nav ul li.lang ul li a:hover { background: #333; color: #fff;}
@media (max-width: 1001px) {
	#hd .nav ul li.contact { padding: 0 8px;}
	#hd .nav ul li.lang { padding-left: 8px; font-size: 13px;}
	#hd .nav ul li.lang ul li { font-size: 14px;}
	#hd .nav ul li.lang ul li span,
	#hd .nav ul li.lang ul li a { width: 24px; height: 24px; line-height: 24px;}
}
@media (max-width: 641px) {
	#hd .inner-hd { padding-top: 16px;}
	#hd .nav { width: 90px;}
	#hd .nav ul li.tel,
	#hd .nav ul li.contact { display: none;}
	#hd .nav ul li.lang { width: 100%; border-left: none; padding-left: 0px; font-size: 14px;}
	#hd .nav ul li.lang ul li span,
	#hd .nav ul li.lang ul li a { width: 36px; height: 36px; line-height: 36px;}
	#hd .logo { width: 40%;}
}
@media (max-width: 481px) {
	#hd .inner-hd { padding-top: 10px;}
	#hd .logo { padding-top: 5px;}
	#hd .nav { width: 62px;}
	#hd .nav ul li.lang { font-size: 11px;}
	#hd .nav ul li.lang ul li { font-size: 12px;}
	#hd .nav ul li.lang ul li span,
	#hd .nav ul li.lang ul li a { width: 24px; height: 24px; line-height: 24px;}
}


#kv { background: url('../img/bg-kv.jpg') no-repeat 50% 50% / cover;}
#kv .inner-kv { width: 92%; margin: 0 auto; padding: 180px 0 80px;}
#kv h2 { text-align: center;}
#kv h2 img { width: 100%; max-width: 1024px;}
#kv h2 img.sp { display: none;}
@media (max-width: 1001px) {
	#kv .inner-kv { padding: 160px 0 80px;}
}
@media (max-width: 641px) {
	#kv .inner-kv { width: 100%; padding: 0px;}
	#kv h2 img.pc { display: none;}
	#kv h2 img.sp { display: block;}
}

.ttl { text-align: center;}
.ttl:after { content: ''; display: block; width: 0px; height: 0px; margin: 0 auto;
 border: solid 16px transparent; border-top: solid 12px #3160d1; border-bottom: 0px;
}
.ttl h2 { color: #3160d1; font-size: 42px; font-weight: 700; line-height: 1.2;}
.ttl h2 span { display: inline-block; padding-bottom: 8px; border-bottom: solid 3px #3160d1;}
.ttl h2 span span.slash { display: inline-block; padding-bottom: 0px; border-bottom: none;}
@media (max-width: 1001px) {
	.ttl h2 { font-size: 4.0vw;}
}
@media (max-width: 481px) {
	.ttl:after { border: solid 12px transparent; border-top: solid 8px #3160d1; border-bottom: 0px;}
	.ttl h2 { font-size: 23px;}
	.ttl h2 span { padding-bottom: 4px; border-width: 2px;}
	.ttl h2 span span.slash { display: block; font-size: 0px;}
}


#reason {}
#reason .inner-sct { padding: 60px 0;}
#reason .ttl { margin-bottom: 20px;}
#reason .ctn { width: 90%; max-width: 1000px; margin: 0 auto;}
#reason ol { font-size: 0; text-align: center;}
#reason ol li { position: relative; display: inline-block; width: 33%; padding: 30px 0; vertical-align: top;}
#reason ol li span.icn { display: block; width: 72px; position: absolute; left: 0; top: 0; border-radius: 50%; overflow: hidden;}
#reason ol li span.icn img { width: 100%;}
#reason ol li dl { width: 95%; margin: 0 auto;}
#reason ol li dl dt { margin-bottom: 16px;}
#reason ol li dl dt img { width: 94%; max-width: 360px; border-radius: 12px; box-shadow: 0 0 15px rgba(230,170,190,0.4);}
#reason ol li dl dd { font-size: 18px; font-weight: 600;}
#reason ol li dl dd span.aside { font-size: 15px;}
#reason ol li dl dd span.aside.row { display: block;}
#reason ol li dl dd span.marker{ background: linear-gradient(transparent 50%, #d2ff48 50%);}
@media (max-width: 1281px) {
	#reason ol li dl dd { font-size: 1.72vw;}
	#reason ol li dl dd span.aside { font-size: 1.25vw;}
}
@media (max-width: 1001px) {
	#reason ol li { padding: 20px 0;}
	#reason ol li span.icn { width: 50px;}
}
@media (max-width: 641px) {
	#reason .ctn { width: 82%; max-width: 400px;}
	#reason ol li { display: block; width: 100%; padding: 20px 0;}
	#reason ol li dl dd { font-size: 18px;}
	#reason ol li dl dd span.aside { font-size: 14px;}
}
@media (max-width: 481px) {
	#reason .inner-sct { padding: 40px 0;}
	#reason .ttl { margin-bottom: 12px;}
	#reason ol li dl dt { padding: 0 30px;}
	#reason ol li span.icn { left: 30px;}
}

#feature { background: url('../img/bg-ptn.jpg');}
#feature .inner-sct { padding: 80px 0 50px;}
#feature .ttl { margin-bottom: 12px;}
#feature .ctn { width: 90%; max-width: 920px; margin: 0 auto;}
#feature ul { font-size: 0; text-align: center;}
#feature ul li { display: inline-block; width: 50%; padding: 15px 0; vertical-align: top;}
#feature ul li dl { width: 94%; margin: 0 auto;}
#feature ul li dl dt { margin-bottom: 20px;}
#feature ul li dl dt img { width: 92%; max-width: 420px; border-radius: 12px; box-shadow: 0 0 15px rgba(230,170,190,0.4);}
#feature ul li dl dd { letter-spacing: 0.075rem;}
#feature ul li dl dd.tit { margin-bottom: 15px; color: #3160d1; font-size: 21px; font-weight: 700; text-align: center;}
#feature ul li dl dd.txt { width: 92%; margin: 0 auto; font-size: 16px; text-align: justify;}
@media (max-width: 1001px) {
	#feature ul li dl dd.tit { margin-bottom: 10px; font-size: 2.2vw;}
	#feature ul li dl dd.txt { font-size: 1.6vw;}
}
@media (max-width: 641px) {
	#feature .ttl { margin-bottom: 6px;}
	#feature ul li { display: block; width: 100%; padding: 20px 0;}
	#feature ul li dl dt img { box-shadow: 0 0 8px rgba(230,170,190,0.4);}
	#feature ul li dl dd.tit { font-size: 18px;}
	#feature ul li dl dd.txt { font-size: 14px;}
}
@media (max-width: 481px) {
	#feature .inner-sct { padding: 40px 0;}
	#feature ul li { padding: 12px 0;}
	#feature ul li dl dt { padding: 0 10px;}
	#feature ul li dl dd.tit { font-size: 16px; letter-spacing: 0.05rem;}
}


#works { background: #eaf0ff;}
#works .inner-sct { padding: 60px 0;}
#works .ttl { margin-bottom: 40px;}
#works .ctn { display: flex; justify-content: space-between; flex-direction: row-reverse; width: 90%; max-width: 920px; margin: 0 auto;}
#works .ctn .pht { width: 37%;}
#works .ctn .txt { width: 58%;}
#works .ctn .pht figure img { width: 100%; max-width: 350px; border-radius: 15px;}
#works .ctn .txt p { font-size: 17px; font-weight: 700; letter-spacing: 0.074rem;}
#works .ctn .txt ol li { position: relative; margin-bottom: 15px; padding: 5px 0 20px 76px; border-bottom: solid 1px #accbd6;
font-size: 16px; letter-spacing: 0.074rem; line-height: 1.72;}
#works .ctn .txt ol li:last-child { margin-bottom: 0px; padding-bottom: 0px; border-bottom: none;}
#works .ctn .txt ol li span.icn { width: 42px; position: absolute; left: 10px; top: 0; border-radius: 50%; overflow: hidden;}
#works .ctn .txt ol li span.icn img { width: 100%;}
#works .ctn .txt ol li span.tit { display: block; margin-bottom: 4px; font-size: 17px; font-weight: 700;line-height: 1.5;}
@media (max-width: 1001px) {
	#works .ctn .txt ol li,
	#works .ctn .txt p { font-size: 1.72vw;}
}
@media (max-width: 801px) {
	#works .ctn .txt ol li { margin-bottom: 10px; padding: 4px 0 15px 55px; font-size: 13px;}
	#works .ctn .txt ol li span.icn { width: 30px; top: 6px;}
	#works .ctn .txt p { font-size: 13px;}
}
@media (max-width: 641px) {
	#works .ttl { margin-bottom: 20px;}
	#works .ctn { display: block;}
	#works .ctn .pht { width: 80%; margin: 0 auto 20px;}
	#works .ctn .pht figure { text-align: center;}
	#works .ctn .txt { width: 100%;}
}
@media (max-width: 481px) {
	#works .inner-sct { padding: 40px 0;}
}

#type {}
#type .inner-sct { padding: 60px 0;}
#type .ttl { margin-bottom: 30px;}
#type ul { width: 90%; max-width: 900px; margin: 0 auto 30px; font-size: 0;}
#type ul li { display: inline-block; width: 33.33334%; vertical-align: top;}
#type ul li dl { width: 94%; max-width: 290px; margin: 0 auto;}
#type ul li dl dt { margin-bottom: 30px; text-align: center;}
#type ul li dl dt img { width: 92%; max-width: 180px; border: solid 1px #3160d1; border-radius: 50%; box-shadow: 0 0 15px rgba(230,170,190,0.4);}
#type ul li dl dd { font-size: 16px;}
#type ul li dl dd span { display: block; font-size: 26px; font-weight: 700; text-align: center;}
#type .btn { width: 80%; max-width: 440px; margin: 0 auto;}
#type .btn a { display: block; padding: 15px 0; background: linear-gradient(#1fb256, #3fc572); border-radius: 10px;
 color: #fff; font-size: 18px; font-weight: 700; letter-spacing: 0.074rem; line-height: 1.4; text-align: center; text-decoration: none;
}
#type .btn a:hover { opacity: 0.8;}
@media (max-width: 1001px) {
	#type ul li dl dd { font-size: 1.8vw;}
	#type ul li dl dd span { font-size: 2.6vw;}
}
@media (max-width: 801px) {
	#type ul li dl dt { margin-bottom: 20px;}
	#type ul li dl dd { font-size: 14px;}
	#type ul li dl dd span { font-size: 21px;}
}
@media (max-width: 641px) {
	#type .ttl { margin-bottom: 0px;}
	#type ul { margin: 0 auto 20px;}
	#type ul li { display: block; width: 100%; padding: 12px 0;}
	#type ul li dl { display: table; width: 90%; max-width: 400px;}
	#type ul li dl dt,
	#type ul li dl dd { display: table-cell; vertical-align: middle;}
	#type ul li dl dt { width: 35%;}
	#type ul li dl dd { width: 65%; padding-left: 20px;}
	#type ul li dl dt img { box-shadow: 0 0 10px rgba(230,170,190,0.4);}
	#type ul li dl dd span { text-align: left;}
}
@media (max-width: 481px) {
	#type .inner-sct { padding: 40px 0;}
	#type .ttl { margin-bottom: 10px;}
	#type ul li dl dt { width: 30%;}
	#type ul li dl dd { width: 70%;}
	#type .btn a { padding: 10px 0;}
	#type .btn a span { display: block;}
}


#flow { background: url('../img/bg-flow.jpg') no-repeat 50% 50% / cover	;}
#flow .inner-sct { padding: 60px 0;}
#flow .ttl { margin-bottom: 30px;}
#flow p { margin-bottom: 30px; font-size: 18px; font-weight: 700; text-align: center;}
#flow p br { display: none;}
#flow ol { width: 92%; max-width: 840px; margin: 0 auto;}
#flow ol li { margin-bottom: 15px;}
#flow ol li:last-child { margin-bottom: 0px;}
#flow ol li:last-child:after { content: none;}
#flow ol li:after { content: ''; display: block; width: 0px; height: 0px; margin: 0 auto;
 border: solid 70px transparent; border-top: solid 18px #adadad; border-bottom: 0px;
}
#flow ol li dl { position: relative; display: table; width: 100%; margin-bottom: 15px; padding: 16px; background: #fff; box-shadow: 0 0 15px rgba(230,170,190,0.4); border-radius: 15px; overflow: hidden;}
#flow ol li dl dt,
#flow ol li dl dd { display: table-cell; vertical-align: middle;}
#flow ol li dl dt { width: 100px; text-align: center;}
#flow ol li dl dt img { width: 50%;}
#flow ol li dl dd.txt { height: 120px; padding-left: 30px; padding-right: 250px; border-left: solid 1px #7998e2;
 font-size: 17px; letter-spacing: 0.075rem;
}
#flow ol li dl dd.txt span { display: block; margin-bottom: 6px; font-size: 26px; font-weight: 700; line-height: 1.2;}
#flow ol li dl dd.pht { display: block; width: 230px; position: absolute; right: 0; top: 0;}
#flow ol li dl dd.pht img { width: 100%;}
@media (max-width: 1001px) {
	#flow ol li dl dd.txt { font-size: 1.8vw;}
	#flow ol li dl dd.txt span { font-size: 2.6vw;}
}
@media (max-width: 801px) {
	#flow p { margin-bottom: 20px; font-size: 16px;}
	#flow ol li dl { padding: 12px;}
	#flow ol li dl dt { width: 80px;}
	#flow ol li dl dd.txt { height: 100px; padding-left: 20px; padding-right: 200px; font-size: 14px;}
	#flow ol li dl dd.txt span { font-size: 20px}
	#flow ol li dl dd.pht { width: 180px;}
}
@media (max-width: 641px) {
	#flow ol li:after { border: solid 40px transparent; border-top: solid 15px #adadad; border-bottom: 0px;}
	#flow ol li dl { display: block; min-height: 120px; padding: 15px 20px; border-radius: 10px; box-shadow: 0 0 8px rgba(230,170,190,0.4);}
	#flow ol li dl dt,
	#flow ol li dl dd { display: block;}
	#flow ol li dl dt { width: 72px; position: absolute; left: 10px; top: 18px;}
	#flow ol li dl dd.txt { height: auto; padding-left: 0px; padding-right: 180px; border-left: none; font-size: 14px;}
	#flow ol li dl dd.txt span { width: 100%; padding: 6px 0 10px; padding-left: 55px; border-bottom: solid 1px #7998e2;}
}
@media (max-width: 481px) {
	#flow .inner-sct { padding: 40px 0;}
	#flow .ttl { margin-bottom: 12px;}
	#flow p { font-size: 16px;}
	#flow p br { display: block;}
	#flow ol li dl { min-height: auto; border-radius: 10px;}
	#flow ol li dl dd.txt { padding-left: 0px; padding-right: 110px; border-left: none; font-size: 14px; line-height: 1.4;}
	#flow ol li dl dd.pht { width: 100px; right: 20px; top: 50%; transform: translateY(-50%);}
}


#products {}
#products .inner-sct { padding: 80px 0;}
#products .ttl { margin-bottom: 30px;}
#products .box { width: 90%; max-width: 900px; margin: 0 auto; border-radius: 15px; box-shadow: 0 0 15px rgba(230,170,190,0.4);}
#products .box.mb { margin-bottom: 30px;}
#products .box .inner-box { display: flex; justify-content: space-around; padding: 30px 40px;}
#products .box .inner-box.mid { align-items: center;}
#products .box .txt-1 { width: 72%;}
#products .box .img-1 { width: 25%;}
#products .box .txt-2 { width: 66%;}
#products .box .img-2 { width: 30%;}
#products .box .tit { margin-bottom: 20px; padding-bottom: 15px; border-bottom: solid 1px #accbd6;}
#products .box .tit h3 { color: #3160d1; font-size: 22px; line-height: 1.4; letter-spacing:0.075rem;}
#products .box .tit h3 span { display: block; font-size: 28px;}
#products .box .txt-1 p { letter-spacing: 0.075rem; line-height: 1.8;}
#products .box .img-1 figure { text-align: center;}
#products .box .img-1 figure img { width: 80%; max-width: 120px;}
#products .box .txt-2 p { letter-spacing: 0.075rem; line-height: 1.8;}
#products .box .img-2 figure { text-align: right;}
#products .box .img-2 figure img { width: 92%; max-width: 240px;}
@media (max-width: 1001px) {
	#products .box .tit h3 { font-size: 2.2vw;}
	#products .box .tit h3 span { font-size: 2.8vw;}
	#products .box .txt-1 p,
	#products .box .txt-2 p { font-size: 1.72vw;}
}
@media (max-width: 801px) {
	#products .box .inner-box { padding: 20px 25px;}
	#products .box .tit { margin-bottom: 15px; padding-bottom: 10px;}
	#products .box .tit h3 { font-size: 15px; letter-spacing:0.05rem;}
	#products .box .tit h3 span { font-size: 17px;}
	#products .box .txt-1 p,
	#products .box .txt-2 p { font-size: 14px;}
}
@media (max-width: 481px) {
	#products .inner-sct { padding: 40px 0;}
	#products .ttl { margin-bottom: 20px;}
	#products .box { border-radius: 10px; box-shadow: 0 0 8px rgba(230,170,190,0.4);}
	#products .box.mb { margin-bottom: 20px;}
	#products .box .inner-box { display: block; padding: 20px 20px 30px;}
	#products .box .txt-1 { width: 100%; margin: 0 auto 20px;}
	#products .box .img-1 { width: 100%;}
	#products .box .txt-2 { width: 100%; margin: 0 auto 20px;}
	#products .box .img-2 { width: 100%;}
	#products .box .img-2 figure { text-align: center;}
}



#contact { background: #eaf0ff;}
#contact .inner-sct { padding: 60px 0;}
#contact .ttl { margin-bottom: 30px;}
#contact p { margin-bottom: 30px; font-size: 21px; font-weight: 700; letter-spacing: 0.075rem; text-align: center;}
#contact .ctn-tel { width: 90%; max-width: 880px; margin: 0 auto 30px; padding: 20px;
 background: #fff; border-radius: 15px; box-shadow: 0 0 15px rgba(230,170,190,0.4);}
#contact .ctn-tel dl { display: table; width: 100%;}
#contact .ctn-tel dl dt,
#contact .ctn-tel dl dd { display: table-cell; vertical-align: middle;}
#contact .ctn-tel dl dt { width: 45%; color: #3160d1; font-size: 26px; font-weight: 700; text-align: center;}
#contact .ctn-tel dl dd { width: 55%; padding: 18px 0; border-left: solid 1px #7998e2;}
#contact .ctn-tel dl dd span { display: block; width: 90%; max-width: 360px; margin: 0 auto;}
#contact .ctn-tel dl dd span img { width: 100%;}
#contact .ctn-tel dl dd a { display: none;}
#contact .ctn { width: 90%; max-width: 880px; margin: 0 auto; padding: 0 15px 40px; background: #fff; border-radius: 15px; box-shadow: 0 0 15px rgba(230,170,190,0.4);}
#contact .ctn ul { width: 94%; margin: 0 auto 20px;}
#contact .ctn ul li { padding: 6px 0; border-bottom: solid 1px #accbd6;}
#contact .ctn ul li dl { display: table; width: 100%;}
#contact .ctn ul li dl dt,
#contact .ctn ul li dl dd { position: relative; display: table-cell; }
#contact .ctn ul li dl dt { width: 250px; padding: 6px 15px; color: #333; font-size: 20px; font-weight: 700;}
#contact .ctn ul li dl dt span.must { display: inline-block; width: 50px; margin-left: 8px; background: #e27530; border-radius: 50px;
 color: #fff; font-size: 14px; line-height: 1.4; text-align: center; vertical-align: middle;
}
#contact .ctn ul li dl dd { width: auto; padding: 6px;}
#contact .ctn ul li dl dd input[type="text"],
#contact .ctn ul li dl dd input[type="email"],
#contact .ctn ul li dl dd input[type="tel"],
#contact .ctn ul li dl dd textarea { padding: 5px; border: none; background: #ececec; border-radius: 4px;}
#contact .ctn ul li dl dd input.mid { width: 50%;}
#contact .ctn ul li dl dd input.wide,
#contact .ctn ul li dl dd input[type="email"],
#contact .ctn ul li dl dd input[type="tel"]{ width: 100%;}
#contact .ctn ul li dl dd textarea { width: 100%; height: 120px;}
#contact .ctn ul li dl dd div.select { position: relative; width: 100%; max-width: 360px; border-radius: 4px; overflow: hidden; background: #ececec;}
#contact .ctn ul li dl dd div.select:after { content: ''; display: block; width: 0px; height: 0px; border: solid 7px transparent; border-top: solid 12px #3160d1;
 position: absolute; right: 10px; top: 35%;
}
#contact .ctn ul li dl dd div.select select { position: relative; width: 100%; padding: 5px; padding-right: 20px; appearance: none; -webkit-appearance: none; border: none; background: none; z-index: 2;}
#contact .ctn ul li dl dd 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;
}
#contact .ctn ul li dl dd 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;}
}

#contact .ctn .submit { width: 80%; margin: 0 auto; text-align: center;}
#contact .ctn .submit input[type="submit"] { width: 100%; max-width: 270px; margin: 0 auto; padding: 12px 0; background: linear-gradient(#1fb256, #3fc572); border: none;
 color: #fff; font-size: 20px; font-weight: 700; text-align: center; border-radius: 10px;
}
#contact .ctn .submit input[type="submit"]:hover { opacity: 0.8;}
#contact .ctn .submit ul { font-size: 0; text-align: center;}
#contact .ctn .submit ul li { display: inline-block; width: 50%; border: none; font-size: 16px;}
#contact .ctn .submit ul li a { display: block; width: 94%; margin: 0 auto; padding: 8px 0; border-radius: 5px; text-decoration: none;}
#contact .ctn .submit ul li.back a { background: #eee; color: #333;}
#contact .ctn .submit ul li.send a { background: linear-gradient(#1fb256, #3fc572); color: #fff; font-weight: 700;}
@media (max-width: 1001px) {
	#contact p { font-size: 2.25vw;}
	#contact .ctn-tel dl dt { font-size: 2.6vw;}

	#contact .ctn ul li dl dt { width: 200px; padding: 10px 15px; font-size: 16px;}
	#contact .ctn ul li dl dt span.must { font-size: 14px;}
}
@media (max-width: 641px) {
	#contact .ctn ul li dl dt,
	#contact .ctn ul li dl dd { display: block; width: 100%;}
	#contact .ctn ul li dl dt { width: 100%; padding: 5px; font-size: 16px;}
	#contact .ctn ul li dl dd { padding-top: 0px;}
}
@media (max-width: 481px) {
	#contact .inner-sct { padding: 40px 0;}
	#contact .ttl { margin-bottom: 20px;}
	#contact p { width: 90%; margin: 0 auto 20px; font-size: 15px; text-align: left;}
	#contact p br { display: none;}
	#contact .ctn-tel { margin: 0 auto 20px; padding: 10px 15px; border-radius: 10px; box-shadow: 0 0 8px rgba(230,170,190,0.4);}
	#contact .ctn-tel dl dt,
	#contact .ctn-tel dl dd { display: block;}
	#contact .ctn-tel dl dt { width: 100%; margin: 0 auto; font-size: 21px;}
	#contact .ctn-tel dl dd { width: 100%; padding: 8px 0; border-left: none;}
	#contact .ctn-tel dl dd span { display: none;}
	#contact .ctn-tel dl dd a { display: block; width: 90%; max-width: 360px; margin: 0 auto; border-radius: 10px; overflow: hidden;}
	#contact .ctn-tel dl dd a img { width: 100%;}

	#contact .ctn { padding: 0 12px 20px; border-radius: 10px; box-shadow: 0 0 8px rgba(230,170,190,0.4);}
	#contact .ctn ul { width: 94%; margin: 0 auto 12px;}
	#contact .ctn ul li { padding: 4px 0;}
	#contact .ctn ul li dl dt { }
	#contact .ctn ul li dl dt span.must { font-size: 13px; vertical-align: baseline;}
	#contact .ctn ul li dl dd input.mid { width: 80%;}
	#contact .ctn ul li dl dd textarea { height: 100px;}
	#contact .ctn ul li dl dd div.select:after { border: solid 5px transparent; border-top: solid 9px #3160d1; right: 6px;}

	#contact .ctn ul li dl dd div.select select { font-size: 14px;}
	#contact .ctn .submit input[type="submit"] { padding: 10px 0; font-size: 16px;}
}

.pagetop { width: 65px; position: fixed; left: 4%; bottom: 120px;}
.pagetop a { display: block; width: 100%; border-radius: 50%; overflow: hidden;}
.pagetop a img { width: 100%;}
.pagetop a:hover { opacity: 0.8;}
@media (max-width: 1001px) {
	.pagetop { width: 50px; left: 2%; bottom: 110px;}
}
@media (max-width: 481px) {
	.pagetop { width: 40px; bottom: 80px;}
}

#ft .copyright { padding: 25px 0 110px;}
#ft .copyright p { font-size: 14px; text-align: center;}
@media (max-width: 801px) {
	#ft .copyright { padding: 25px 0 90px;}
}
@media (max-width: 481px) {
	#ft .copyright p { font-size: 11px;}
}

.ft-fixd { position: fixed; width: 100%; left: 0px; bottom: 0px; background: #fff; box-shadow: 0 0 15px rgba(230,170,190,0.4); z-index: 10;}
.ft-fixd .inner { position: relative; width: 100%; max-width: 980px; margin: 0 auto; padding: 25px 0; padding-right: 320px;}
.ft-fixd .inner:after { content: ''; display: block; width: 300px; height: 150px;
 background: url('../img/fix-bnr.png') no-repeat 50% 0 / 100% auto;
 position: absolute; right: 0; bottom: 0;
}
.ft-fixd ul { font-size: 0;}
.ft-fixd ul li { display: inline-block; width: 50%; vertical-align: middle;}
.ft-fixd ul li.tel a { display: none;}
.ft-fixd ul li.tel span { display: block; width: 92%; margin: 0 auto;}
.ft-fixd ul li.tel span img { width: 100%;}

.ft-fixd ul li.form a { display: block; width: 92%; margin: 0 auto; padding: 12px 0; background: linear-gradient(#1fb256, #3fc572); border-radius: 10px;
 color: #fff; font-size: 18px; font-weight: 700; letter-spacing: 0.075rem; line-height: 1.2; text-align: center; text-decoration: none;
}
.ft-fixd ul li.form a br { display: none;}
.ft-fixd ul li.form a:hover { opacity: 0.8;}

@media (max-width: 1001px) {
	.ft-fixd .inner { padding: 18px 0; padding-right: 280px;}
	.ft-fixd .inner:after { width: 260px; height: 130px;}
}
@media (max-width: 641px) {
	.ft-fixd .inner { padding: 12px 0;  padding-right: 220px;}
	.ft-fixd .inner:after { width: 210px; height: 100px;}
	.ft-fixd ul li.form a { padding: 8px 0; font-size: 15px;}
	.ft-fixd ul li.form a br { display: block;}
}
@media (max-width: 481px) {
	.ft-fixd .inner { padding: 8px 16px 10px; padding-right: 92px;}
	.ft-fixd .inner:after { width: 90px; height: 105px; background: url('../img/fix-bnr-sp.png') no-repeat 50% 0 / 100% auto;}
	.ft-fixd ul li.tel a { display: block; width: 92%; margin: 0 auto; padding: 8px 0;
	 background: linear-gradient(#3160d1, #5682eb); border-radius: 6px;
	 color: #fff; font-size: 15px; font-weight: 700; letter-spacing: 0.075rem; line-height: 1.2; text-align: center; text-decoration: none;
	}
	.ft-fixd ul li.tel span { display: none;}
	.ft-fixd ul li.form a { padding: 8px 0; background: linear-gradient(#1fb256, #3fc572); border-radius: 6px; font-size: 15px;}
}


.thanks .inner { width: 90%; height: 94vh; margin: 0 auto; padding-top: 200px;}
.thanks .ttl { margin-bottom: 20px;}
.thanks p { margin-bottom: 40px; font-size: 20px; text-align: center;}
.thanks p a {}
.thanks p a:hover { text-decoration: none;}
.thanks .btn { width: 55%; max-width: 280px; margin: 0 auto;}
.thanks .btn a { display: block; width: 100%; padding: 8px 0; background: linear-gradient(#1fb256, #3fc572); border: none;
 color: #fff; font-size: 20px; font-weight: 700; text-align: center; text-decoration: none; border-radius: 10px;
}
.thanks .btn a:hover { opacity: 0.8;}
@media (max-width: 481px) {
	.thanks p { font-size: 15px;}
	.thanks .btn a { padding: 6px 0; font-size: 14px;}
}