@charset "utf-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
/* ==========================================================================
Common
========================================================================== */
*,
*:before,
*:after {
  box-sizing: inherit;
}
html {
    box-sizing: border-box;
    scroll-behavior: smooth;
}
.flex { display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.inline-flex { display: -webkit-flex; display: inline-flex; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.flex-between { justify-content:space-between; -webkit-justify-content:space-between; }
.flex-center  { justify-content:center; -webkit-justify-content:center; }
.flex-end  { justify-content:flex-end; -webkit-justify-content:flex-end; }
.flex-txt-center{display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center;}
figure img{width: 100%; height: auto;}
picture img{width: 100%; height: auto;}
img{ -webkit-backface-visibility: hidden; }
body {
  	font-family: 'Arial', 'Noto Sans JP', "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
	font-size:18px;
    color: #333;
	line-height:2em;
	margin: 0;
  	padding: 0;
	position:relative;
    font-feature-settings: "palt";
    text-align: justify;
    text-justify: inter-ideograph;
	}
@media screen and (max-width:767px){
    body { font-size:18px; line-height:1.8em; }
}

ul,li{
	margin:0; padding:0;
	list-style:none;
	}

h1,h2,h3,h4,h5,h6{
	margin:0;
	font-weight:normal;
	line-height:1.4em;
	}
.gochic{
    font-family: 'Arial', 'Noto Sans JP', "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
}
.mincho{
    font-family: "リュウミン R-KL","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.content_in{
	width:1180px;
	margin:0 auto;
	position:relative;
	}

@media screen and (max-width:1579px){
    .content_in{width:1000px; }
    body { font-size:16px; line-height:1.8em; }
}
@media screen and (max-width:767px){
    .content_in{width:90%; }
}

a[target="_blank"].exicon::after{
    display: inline-block;
    content: url("../images/common/icon_new-tab.svg");
    width: 18px;
    height: 18px;
    margin-left: 5px;
}

.mt000{margin-top: 0px!important;}
.mb000{margin-bottom: 0px!important;}
.mb010{margin-bottom: 10px!important;}
.mb005{margin-bottom: 5px!important;}
.mb020{margin-bottom: 20px!important;}
.mb030{margin-bottom: 30px!important;}
.mb040{margin-bottom: 40px!important;}
.mb050{margin-bottom: 50px!important;}
.mb060{margin-bottom: 60px!important;}
.mb080{margin-bottom: 80px!important;}
.mb100{margin-bottom: 100px!important;}

@media screen and (max-width:767px){
    .mb080{margin-bottom: 50px!important;}
    .mb100{margin-bottom: 60px!important;}
}


/* ==========================================================================
ヘッダー
========================================================================== */
header{ background: #FFF; height: 65px; position: fixed; z-index: 10; width: 100%; box-shadow: 0px 0px 10px 0 rgba(0, 0, 0, .1); }
header .content_in{ width: 100%; }
header .logo{width: 260px;padding-top: 7px; padding-left: 10px; }
header .logo a{display: block; }
header .contact{width: calc(100% - 260px);}
header .contact .tel{ width: 280px; height: 65px; line-height: 1.5em;padding-top: 10px; }
header .contact .tel img{ width: 40px; margin-right: 3px;}
header .contact .tel p{font-size: 33px;}
header .contact .tel p a{color: #333;}
header .contact .tel span{ font-size: 14px; }
header .contact .mail{ width: 170px; text-align: center; }
header .contact .mail a{ position: relative; z-index: 0; display: block; height: 100%; color: #FFF; font-weight: bold; display: flex; justify-content: center; align-items: center; }
header .contact .mail a::before{
    content:""; width:100%; height:100%; position:absolute; z-index:-1; left:0; transition:0.3s;
    background-image: linear-gradient(90deg, rgba(255, 123, 172, 1), rgba(193, 39, 45, 1));
}
header .contact .mail a::after{
    content:""; width:100%; height:100%; position:absolute; z-index:-2; left:0; transition:0.3s;
    background-image: linear-gradient(90deg, rgba(233, 86, 125, 1), rgba(95, 11, 18, 1));
}
header .contact .mail a:hover::before{ opacity:0; }

header .sp_icon{ display: none; }

@media screen and (max-width:1579px){
    header{ height: 50px; }
    header .content_in{ width: 100%; }
    header .logo{width: 220px;padding-top: 5px; padding-left: 10px; }
    header .contact{width: calc(100% - 220px);}
    header .contact .tel{ width: 240px; height: 50px; line-height: 1.2em;padding-top: 8px; }
    header .contact .tel img{ width: 32px;}
    header .contact .tel p{font-size: 28px;}
    header .contact .tel p a{color: #333;}
    header .contact .tel span{ font-size: 13px; }
    header .contact .mail{ width: 170px; text-align: center; }
}

@media screen and (max-width:767px){
    header{ height: 50px; }
    header .content_in{ width: 100%; }
    header .logo{width: 180px;padding-top: 8px; padding-left: 10px; }
    header .contact{display: none;}
    
    header .sp_icon{ display: flex; width: 100px; }
    header .sp_icon .phone{ width: 50px; height: 50px; }
    header .sp_icon .phone a{ display: block; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background-image: linear-gradient(90deg, rgba(57, 181, 74, 1), rgba(0, 104, 55, 1)); }
    header .sp_icon .phone a img{width: 25px; }
    header .sp_icon .mail{ width: 50px; height: 50px; }
    header .sp_icon .mail a{ display: block; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center;     background-image: linear-gradient(90deg, rgba(255, 123, 172, 1), rgba(193, 39, 45, 1)); }
    header .sp_icon .mail a img{width: 25px; }
}

/******************************************************
フォームスタイル
*******************************************************/
::placeholder { color: #BBB; }
.form_block{ padding: 0 0 0 0; line-height: 1.9em; font-feature-settings: "palt"; text-align: justify; text-justify: inter-ideograph; overflow-x: hidden; }
.form_block{ width: 100%; margin: 0 auto; font-size: 16px; }
.form_block .form table{ width:100%; table-layout: fixed; }
	
.form_block table.form_table{ width:100%; table-layout: fixed;  border-top:1px solid #BBB; border-collapse: collapse; border-spacing: 0; }
.form_block table.form_table tr{ border-bottom:1px solid #BBB; }
.form_block table.form_table th{ font-weight:normal; width:24%; min-width:120px; text-align:left; padding:15px 20px; background: #eef1f9; }
.form_block table.form_table th span, table.form_table td span.required{ font-size:16px; color:#EE0000; margin-left:5px; font-weight: bold;}
.form_block table.form_table td{ padding:15px 20px; position: relative; }

.form_block table.form_table .position {margin-bottom: 10px; display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between; -webkit-justify-content:space-between; }
.form_block table.form_table .position .parts { width: 48.5%; display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between; -webkit-justify-content:space-between; }
.form_block table.form_table .name_parts {width: 100%; display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between; -webkit-justify-content:space-between; }
.form_block table.form_table .address_parts {width: 100%; margin-bottom: 10px; display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between; -webkit-justify-content:space-between; }
.form_block table.form_table .zip_parts{width: calc(100% - 115px); display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; }
.form_block table.form_table .zip_parts span{display: inline-block;width: auto;}
.form_block table.form_table .zip_parts p{width: 30px; display: flex; justify-content: center; align-items: center;}

.form_block table.form_table .position .parts span, table.form_table .name_parts span, table.form_table .address_parts span{
    display: block;
    width: calc(100% - 115px);
}
.form_block table.form_table .position .parts label, table.form_table .name_parts label, table.form_table .address_parts label
	{width: 110px;
    font-weight: bold;
    color: #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background: #999;
}

.form_block input#zip1{ width:100px; }
.form_block input#zip2{ width:120px;padding-left: 8px; }

.form_block input, .form_block textarea, .form_block select { font-family: inherit; font-size: 16px; color: inherit; box-sizing:border-box;}
.form_block select[multiple] { height: 50px;}

.form_block input[type="text"], .form_block input[type="tel"], .form_block input[type="email"], .form_block select, .form_block textarea{
	width:100%; padding:13px; border-radius: 5px; border:1px solid #999;  background: linear-gradient(180deg, #DEDEDE 0%, #DEDEDE 5px, #F6F6F6 5px, #F6F6F6 100%);
}
.form_block input[type="text"]:focus, .form_block input[type="tel"]:focus, .form_block input[type="email"]:focus, .form_block select:focus, .form_block textare:focus{
    outline: 1px #0FAFAA solid; border:1px solid #0FAFAA;
}


.form_block  input[type="submit"] { cursor: pointer; font-size:22px; padding:20px 0; width:280px; color:#FFF; font-weight: bold; background-color:#900; border:none; transition: 0.3s; border-radius: 5px;}
.form_block  .wpcf7-submit:disabled{ background-color: #CCC;cursor: not-allowed;}
.form_block #submit_box{ text-align:center; padding:35px 0 30px 0; }
.form_block input[type="checkbox"], .form_block input[type="radio"] { display: inline-block; margin: 0 2px; padding: 0; vertical-align: middle; position: relative; top: -1px; cursor: pointer;
    -moz-transform:	scale(2.0); -webkit-transform: scale(2.0); transform: scale(2.0); width: 32px; }

.form_block .caution{text-align: right;margin: 0 0 10px 0;}
.form_block .caution span{color: #EE0000; font-weight: bold;}
.form_block .caption{padding:20px; border: 1px solid #CCC;border-radius: 5px;line-height: 1.8em;}
.form_block .caption ul{margin: 0;padding: 0;}
.form_block .caption ul li{ list-style: none; padding-left: 1em; text-indent: -1em; font-size: 14px;}

.form_block span.wpcf7-list-item{ margin: 0 20px 0 0; }
.form_name_hidden{display: none;}

.form_block .attr{ padding:20px; border: 1px solid #CCC;border-radius: 5px;line-height: 1.8em; }

.form_block .form_caption{ border: 1px solid #CCC; padding: 20px; margin-bottom: 40px; }
.form_block .form_caption li { position: relative; font-size: 14px; line-height: 1.7em; padding-left: calc(1em + 7px); }
.form_block .form_caption li::before{ position: absolute; content: "※"; top: 0; left: 0; }

@media screen and (max-width:767px){
    .form_block table.form_table th{ display: block; width:100%; padding:8px 10px;}
    .form_block table.form_table td{ display: block; width: 100%; padding:10px 10px 30px 10px;}
	.form_block .service_desc span.wpcf7-list-item{width: 100%;}
	.form_block span.wpcf7-list-item{width: 100%;}
    .form_block table.form_table .position .parts span, table.form_table .name_parts span, table.form_table .address_parts span{width: calc(100%);}
    .form_block table.form_table .position .parts label, table.form_table .name_parts label, table.form_table .address_parts label{width: 100%; margin-bottom: 5px;padding: 1px 10px; justify-content:flex-start ;align-items:flex-start; }
    .form_block table.form_table th span, table.form_table td span.required{width: auto;}
    .form_block table.form_table .zip_parts{width: 100%;}
}

/* ==========================================================================
トップページ
========================================================================== */
#home{ }
#home .fv{ padding-top: 85px; height: 920px; position: relative; 
    background-image: url("../images/home/home_back_machi.png"), url("../images/home/home_back.png");
    background-repeat: no-repeat, repeat-x;
    background-size: auto, 100% auto;
    background-position: bottom center, bottom center;
}
#home .fv .content_in{ height: 100%;}
#home .fv .content_in img{ width: 100%; height: auto;}
#home .fv .catch{ width: 610px; position: absolute; top: 32px; left: -40px; }
#home .fv .jinji{ width: 570px; position: absolute; top: 32px; right: -70px; }
#home .fv .illust{ width: 340px; position: absolute; bottom: 0; left: -80px; }
#home .fv .fukidashi{ width: 910px; position: absolute; bottom: 50px; right: -20px; }
#home .fv .needs{ width: 590px;margin-bottom: 10px; }


.contact_area{ background: #E6EBEF; padding: 60px 0; }
.contact_area p{ text-align: center; font-weight: bold; margin-bottom: 30px;}
.contact_area .mail{ width: 70%; margin: 0 auto 20px auto; }
.contact_area .mail a{ position: relative; z-index: 0; display: block; text-align: center; font-size: 32px; font-weight: bold; color: #FFF;
    text-shadow: 2px 2px 0px rgb(0, 0, 0, 0.3);
}
.contact_area .mail a span{ display: inline-block; padding: 20px 0; }
.contact_area .mail a::before{
    content:""; width:100%; height:100%; position:absolute; z-index:-1; left:0; transition:0.3s; border-radius: 10px; 
    background-image: linear-gradient(90deg, rgba(251, 176, 59, 1), rgba(241, 90, 36, 1));
}
.contact_area .mail a::after{
    content:""; width:100%; height:100%; position:absolute; z-index:-2; left:0; transition:0.3s; border-radius: 10px; box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(90deg, rgba(237, 142, 0, 1), rgba(205, 61, 10, 1));
}
.contact_area .mail a:hover::before{ opacity:0; }
.contact_area a:hover img{ opacity:1.0; filter:alpha(opacity=100); -ms-filter: "alpha( opacity=100 )"; background:none!important; }

.contact_area .mail a img{ width: 45px; margin-right: 8px;}
.contact_area .sub { margin-bottom: 30px;}
.contact_area .sub a{ position: relative; z-index: 0; display: block; width: 320px; margin: 0 10px; line-height: 1.2em;
    text-align: center; font-size: 18px; font-weight: bold; color: #FFF; text-shadow: 2px 2px 0px rgb(0, 0, 0, 0.3);
}
.contact_area .sub a img{ height: 24px; margin-right: 8px;}
.contact_area .sub a span{ display: inline-block; padding: 10px 0; }

.contact_area .sub a.resume::before{
    content:""; width:100%; height:100%; position:absolute; z-index:-1; left:0; transition:0.3s; border-radius: 100px; 
    background-image: linear-gradient(90deg, rgba(57, 181, 74, 1), rgba(0, 104, 55, 1));
}
.contact_area .sub a.resume::after{
    content:""; width:100%; height:100%; position:absolute; z-index:-2; left:0; transition:0.3s; border-radius: 100px; box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(90deg, rgba(86, 136, 53, 1), rgba(0, 67, 51, 1));
}
.contact_area .sub a.soudan::before{
    content:""; width:100%; height:100%; position:absolute; z-index:-1; left:0; transition:0.3s; border-radius: 100px; 
    background-image: linear-gradient(90deg, rgba(255, 123, 172, 1), rgba(193, 39, 45, 1));
}
.contact_area .sub a.soudan::after{
    content:""; width:100%; height:100%; position:absolute; z-index:-2; left:0; transition:0.3s; border-radius: 100px; box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(90deg, rgba(233, 86, 125, 1), rgba(95, 11, 18, 1));
}
.contact_area .sub a:hover::before{ opacity:0; }

.contact_area .tel {}
.contact_area .tel .tel_no { width: 300px; }
.contact_area .tel .tel_time { width: 200px; font-size: 14px; }

.contact_area .tel .tel_no img { width: 40px; margin-right: 3px; }
.contact_area .tel .tel_no { font-size: 38px; line-height: 0.8em; }

#home h2.ttl{text-align: center; font-size:38px; font-weight: bold; color: #0071BC; margin-bottom: 30px; }
#home h2.ttl span{ background:linear-gradient(transparent 30%, #ff0 100%); padding: 0 50px; }

#home h3.ttl{ position: relative; z-index: 5; text-align: center; font-size: 33px; font-weight: bold; color:#263270; padding-top: 20px; margin-bottom: 60px; }
#home h3.ttl span{ font-size: 140px; color: #E6EBEF; font-weight: normal; font-style: italic; display: block; position: absolute; top: 0; left: 0 ; right: 0; z-index: -4; }
#home h3.ttl::after{ content: ""; display: block; width: 120px; height: 1px; border-bottom: 2px solid #263270; position: absolute; bottom: -15px; left: 0; right: 0; margin: 0 auto; }

#home section .content_in{ padding: 60px 0;}
#home section .inner p{ margin-bottom: 24px; }

#home section .inner blockquote{ width: 90%; border: 1px solid #AAA; margin:  0 auto 40px auto; padding: 20px 30px 30px 30px; text-align: center; }
#home section .inner blockquote img {width: 100%; max-width: 988px; height: auto; }
#home section .inner blockquote p{font-weight: bold; font-size: 24px; margin: 0;}
#home section .inner blockquote cite{display: block; font-size: 14px; text-align: left!important; font-style: normal; line-height: 1.6em;}
#home section .inner ul{ margin-bottom: 30px; padding-left: 25px; }
#home section .inner ul li{position: relative; font-weight: bold;}
#home section .inner ul li::before{ content: "●"; position: absolute; top: 0; left: -20px; color: #0071BC; }

#home section#sec02{ background: #E6EBEF;}
#home #features .ttl_area{position: relative; background-image: url("../images/home/ttl_back.png");background-repeat: repeat-x;}
#home #features .ttl_area .content_in {padding: 60px 0 40px 0;}
#home #features .ttl_area .content_in h2 {text-align: center; color: #FFF; font-size: 36px; font-weight: bold; }
#home #features .ttl_area .content_in h2 strong {color: #FF0; }
#home #features .ttl_area .content_in h2 span { font-size: 31px; }
#home #features .ttl_area::before{ content: url("../images/home/arrow01.svg"); width: 90px; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto;}
#home #features .ttl_area .content_in figure{width: 275px; position: absolute; bottom: 0; right: -50px;}

#home .desc_box { margin-bottom: 50px; }
#home .desc_box:nth-child(odd) .txt{order: 2;}
#home .desc_box:nth-child(odd) figure{order: 1;}
#home .desc_box .txt{ width: calc(100% - 470px);}
#home .desc_box figure{ width: 420px;}
#home .desc_box .txt ul{ margin-bottom: 30px; padding-left: 25px; }
#home .desc_box .txt ul li{position: relative; margin-bottom: 20px; }
#home .desc_box .txt ul li::before{ content: "●"; position: absolute; top: 0; left: -20px; color: #0071BC; }
#home .desc_box .txt ul li strong{ color: #0071BC; }
#home .desc_box .txt h4{ position: relative; font-size: 30px; font-weight: bold; margin-bottom: 20px; line-height: 1.4em; padding-left: 80px; }
#home .desc_box .txt h4 span{ position: absolute; top:-20px; left: 0; display: block; color: #263270; font-size: 75px; font-weight: normal; font-style: italic; line-height: 1em;}


#home #flow{ background: #E6EBEF;}
#home #flow .content_in{padding: 100px 0 60px 0;}
#home #flow h3.ttl span{ color: #FFF;  }
#home #flow p.bodycopy{text-align: center; margin-bottom: 30px;}

#home #flow .flow_box .inner{width: 23%; background: #FFF; position: relative; border-radius: 8px; }
#home #flow .flow_box .inner::after{content: url("../images/common/arrow_r_white.svg"); width: 25px; height: 100px; position: absolute; top: 0; bottom: 0; right: -24px; margin: auto 0; }
#home #flow .flow_box .inner:last-child::after{ display: none;}

#home #flow .flow_box .inner .ttl{background: #263270; text-align: center; color: #FFF; font-size: 24px; font-weight: bold; line-height: 1.3em; padding: 10px 10px; border-radius: 8px 8px 0 0;}
#home #flow .flow_box .inner .ttl span{ font-size: 17px; font-weight: normal; color: #FF0;}

#home #flow .flow_box .inner .desc{ padding: 15px;}
#home #flow .flow_box .inner .desc .sub_ttl{font-weight: bold; margin-bottom: 5px;}
#home #flow .flow_box .inner .desc ul{ margin-bottom: 20px;}
#home #flow .flow_box .inner .desc ul li{ font-weight: normal; font-size: 90%;}

#home #faq .content_in{padding: 100px 0 60px 0;}
#home #faq .faq_box .inner{background: #FFF; box-shadow: 0 0 6px #CCC; border-radius: 8px; padding: 30px; margin-bottom: 30px; }
#home #faq .faq_box .inner .question{ position: relative; font-weight: bold; margin:  0 0 20px 60px; }
#home #faq .faq_box .inner .question::before{ content: "Q";position: absolute; top: 0; left: -50px; font-size: 46px; color: #263270; }
#home #faq .faq_box .inner .answer{ position: relative; margin:  0 0 0 100px; }
#home #faq .faq_box .inner .answer::before{ content: "A";position: absolute; top: 0; left: -50px; font-size: 46px; color: #29ABE2; font-weight: bold; }
#home #faq .faq_box .inner .answer p:last-child{margin-bottom: 0;}

footer h3.ttl{ position: relative; z-index: 5; text-align: center; font-size: 33px; font-weight: bold; color:#FFF; padding-top: 20px; margin-bottom: 50px; }
footer h3.ttl span{ font-size: 140px; color: #FFF; opacity:0.15; font-weight: normal; font-style: italic; display: block; position: absolute; top: 0; left: 0 ; right: 0; z-index: -4; }
footer h3.ttl::after{ content: ""; display: block; width: 120px; height: 1px; border-bottom: 2px solid #FFF; position: absolute; bottom: -15px; left: 0; right: 0; margin: 0 auto; }
footer .bodycopy{text-align: center; color: #FFF; font-weight: bold; margin-bottom: 30px;}

footer .foot_service{ background-image: url("../images/home/foot_back.jpg"); background-repeat: no-repeat; background-position: top center; background-size: cover; }
footer .foot_service .content_in{ padding: 100px 0 60px 0;}

footer .foot_service ul li{width: 31%; border-radius: 8px;}
footer .foot_service ul li a{ display: block; text-align: center; filter:drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.5)); }
footer .foot_service ul li a .txt { background: #FFF; padding: 20px;transition:0.3s all; border-radius: 8px 8px 0 0;}

footer .foot_service ul li a .txt p{ color: #333; line-height: 1.4em; margin-bottom: 10px; }
footer .foot_service ul li a .txt h4{ text-align: center; font-size: 24px; color: #0071BC; font-weight: bold; line-height: 1.2em;}
footer .foot_service ul li a .txt h4 span{display: block; color: #333; font-size: 19px;}

footer .foot_service ul li a figure{overflow: hidden; border-radius: 0 0 8px 8px;}
footer .foot_service ul li a:hover figure img{ transform:scale(1.1,1.1); transition:0.3s all; }
footer .foot_service ul li a:hover .txt{ background: #E6EBEF;transition:0.3s all; }

footer .contact_area{background: #0B1839; color: #FFF;}

footer .foot_nav{ }
footer .foot_nav .logo{padding: 20px 0;}
footer .foot_nav .logo .inner{ width: 260px; margin: 0 15px; }
footer .foot_nav .logo .inner a{display: block; }

footer .foot_nav nav{ margin-bottom: 30px;}
footer .foot_nav nav ul li { line-height: 1em; border-left: 1px solid #333; border-right: 1px solid #333; padding: 10px 30px; }
footer .foot_nav nav ul li:first-child{ border-right: none; }
footer .foot_nav nav ul li a { color: #333; }
footer .foot_nav nav ul li a img{width: 14px; margin-left: 8px;}
footer .foot_nav nav ul li a:hover { text-decoration: underline; }

footer .foot_nav address{ text-align: center; font-size: 15px; font-style: normal; }
footer .foot_nav .copyright{ text-align: center; border-top: 1px solid #AAA; }

@media screen and (max-width:1579px){
    #home{ }
    #home .fv{ padding-top: 50px; height: 650px; }
    #home .fv .catch{ width: 500px; position: absolute; top: 15px; left: 10px; }
    #home .fv .jinji{ width: 440px; position: absolute; top: 20px; right: 0px; }
    #home .fv .illust{ width: 240px; position: absolute; bottom: 0; left: 0px; }
    #home .fv .fukidashi{ width: 700px; position: absolute; bottom: 25px; right: 10px; }
    #home .fv .needs{ width: 440px;margin-bottom: 5px; }

    .contact_area{ padding: 50px 0; }
    .contact_area .mail{ width: 70%; margin: 0 auto 20px auto; }
    .contact_area .mail a{ font-size: 30px; }
    .contact_area .mail a img{ width: 36px;}
    .contact_area .tel .tel_no { width: 280px; }
    .contact_area .tel .tel_time { width: 200px; font-size: 14px; }
    .contact_area .tel .tel_no img { width: 40px; margin-right: 3px; }
    .contact_area .tel .tel_no { font-size: 34px; line-height: 0.7em; }
    
    #home h2.ttl{ font-size:32px;margin-bottom: 25px; }
    #home h3.ttl{ font-size: 30px;padding-top: 20px; margin-bottom: 60px; }
    #home h3.ttl span{ font-size: 120px; }

    #home section .content_in{ padding: 60px 0;}
    #home section .inner p{ margin-bottom: 24px; }
    #home section .inner blockquote{ margin:  0 auto 40px auto; padding: 20px 30px 30px 30px; }
    #home section .inner blockquote p{font-size: 20px; }
    #home section .inner blockquote cite{font-size: 13px;}
    
    #home #features .ttl_area .content_in {padding: 60px 0 40px 0;}
    #home #features .ttl_area .content_in h2 { font-size: 34px; }
    #home #features .ttl_area .content_in h2 span { font-size: 28px; }
    #home #features .ttl_area::before{ width: 90px;}
    #home #features .ttl_area .content_in figure{ width: 260px;right: -80px;}

    #home .desc_box { margin-bottom: 50px; }
    #home .desc_box .txt{ width: calc(100% - 420px);}
    #home .desc_box figure{ width: 380px;}
    #home .desc_box .txt h4{ font-size: 26px;margin-bottom: 20px; line-height: 1.4em; padding-left: 70px; }
    #home .desc_box .txt h4 span{ top:-10px; font-size: 55px;}
    
    #home #flow .flow_box .inner .ttl{ font-size: 20px; padding: 10px 10px;}
    #home #flow .flow_box .inner .ttl span{ font-size: 16px;}

    #home #faq .content_in{padding: 80px 0 60px 0;}

    footer h3.ttl{ font-size: 30px; }
    footer h3.ttl span{ font-size: 120px; }
    footer .foot_service .content_in{ padding: 80px 0 60px 0;}
    footer .foot_service ul li a .txt p{ font-size: 15px;}
    footer .foot_service ul li a .txt h4{ font-size: 20px;}
    footer .foot_service ul li a .txt h4 span{font-size: 17px;}
}

@media screen and (max-width:767px){
    #home .fv{ padding-top: 50px; height: 670px; overflow: hidden; }
    #home .fv .catch{ width: 320px;top: 15px; left: 0; right: 0; margin: 0 auto; }
    #home .fv .jinji{ width: 320px; top: 230px;  left: 0; right: 0; margin: 0 auto; }
    #home .fv .illust{ display: none; }
    #home .fv .fukidashi{ width: 320px;bottom: auto; top:450px; left: 0; right: 0; margin: 0 auto;}
    #home .fv .needs{ width: 100%;margin-bottom: 5px; }

    .contact_area .mail{ width: 100%; margin: 0 auto 20px auto; }
    .contact_area .mail a{ font-size: 22px; }
    .contact_area .mail a img{ width: 36px;}
    .contact_area .sub{ margin-bottom: 20px;}
    .contact_area .sub a{ margin-bottom: 10px; font-size: 16px;}
    .contact_area .sub a img{ height: 20px;}
    
    .contact_area .tel .tel_no { width: 100%; text-align: center; }
    .contact_area .tel .tel_time { width: 100%; text-align: center; }
    
    #home h2.ttl{ font-size:24px;margin-bottom: 25px; }
    #home h2.ttl span{padding: 0 20px;}
    #home h3.ttl{ font-size: 24px;padding-top: 20px; margin-bottom: 60px; }
    #home h3.ttl span{ font-size: 60px; }

    #home section .content_in{ padding: 50px 0;}
    #home section .inner p{ margin-bottom: 24px; }

    #home section .inner blockquote{ width: 100%; margin:  0 auto 40px auto; padding: 15px 10px 15px 10px; }
    #home section .inner blockquote p{font-size: 16px; }
    #home section .inner blockquote cite{font-size: 12px; margin-top: 8px;}

    #home #features .ttl_area .content_in {padding: 50px 0 30px 0;}
    #home #features .ttl_area .content_in h2 { font-size: 28px; }
    #home #features .ttl_area .content_in h2 span { font-size: 20px; }

    #home #features .ttl_area::before{ width: 90px;}
    #home #features .ttl_area .content_in figure{ display: none; }

    #home .desc_box { margin-bottom: 60px; }
    #home .desc_box:nth-child(odd) .txt{order: 1;}
    #home .desc_box:nth-child(odd) figure{order: 2;}

    #home .desc_box .txt{ width: calc(100%);}
    #home .desc_box figure{ width: 100%;}

    #home .desc_box .txt h4{ font-size: 20px;margin-bottom: 15px; line-height: 1.4em; padding-left: 70px; }
    #home .desc_box .txt h4 span{ top:-10px; font-size: 52px;}
    
    #home #flow p.bodycopy{ text-align: left; }
    #home #flow .content_in{padding: 60px 0 40px 0;}
    #home #flow .flow_box .inner{ width: 100%; margin-bottom: 30px; }
    #home #flow .flow_box .inner::after{ transform: rotate(90deg); width: 25px; height: 100px; position: absolute; top: auto; bottom: -55px; right: 0; left: 0;  margin: 0 auto;
    }

    #home #faq .content_in{padding: 80px 0 60px 0;}
    #home #faq .faq_box .inner{padding: 20px; }
    #home #faq .faq_box .inner .question{ margin:  0 0 20px 40px; }
    #home #faq .faq_box .inner .question::before{ content: "Q";position: absolute; top: 0; left: -40px; font-size: 36px; color: #263270; }

    #home #faq .faq_box .inner .answer{ position: relative; margin:  0 0 0 40px; }
    #home #faq .faq_box .inner .answer::before{ content: "A";position: absolute; top: 0; left: -40px; font-size: 36px; color: #29ABE2; font-weight: bold; }

    footer h3.ttl{ font-size: 22px; }
    footer h3.ttl span{ font-size: 70px; }
    footer .foot_service .content_in{ padding: 80px 0 60px 0;}
    footer .foot_service ul li a .txt p{ font-size: 15px;}
    footer .foot_service ul li a .txt h4{ font-size: 20px;}
    footer .foot_service ul li a .txt h4 span{font-size: 17px;}
    footer .foot_service ul li{ width: 100%; margin-bottom: 20px; }
    
    footer .foot_nav .logo{padding: 20px 0;}
    footer .foot_nav .logo .inner{ width: 180px; margin: 0 0 10px; }
    footer .foot_nav .logo .inner a{display: block; }

    footer .foot_nav nav{ margin-bottom: 30px;}
    footer .foot_nav nav ul li { padding: 10px 20px; }
    footer .foot_nav nav ul li a { font-size: 13px; }
    footer .foot_nav nav ul li a img{width: 11px; margin-left: 5px;}
    footer .foot_nav nav ul li a:hover { text-decoration: underline; }

    footer .foot_nav address{ text-align: center; font-size: 14px; font-style: normal; line-height: 1.4em; margin-bottom: 15px; }
    footer .foot_nav .copyright{ text-align: center; border-top: 1px solid #AAA; }
}

/* ==========================================================================
サブページ
========================================================================== */
#bread{ width: 100%; padding: 10px 0 30px 0; font-size: 14px; line-height: 1em; }
#bread img{ width: 20px; height: 20px; line-height: 1em;margin-bottom: -2px;}
#bread br{ display: none;}

@media screen and (max-width:767px){
    #bread{ padding: 10px 0 10px 0; margin-bottom: 20px; overflow-x: scroll; word-break: keep-all; white-space: nowrap; }
}

/* ==========================================================================
お問い合わせ
========================================================================== */
#contact{padding-top: 65px; border-bottom: 3px solid #263270;  }

#contact .content_in main{ padding-top: 60px; }

#contact h1.ttl{ position: relative; z-index: 5; text-align: center; font-size: 33px; font-weight: bold; color:#263270; padding-top: 20px; margin-bottom: 60px; }
#contact h1.ttl span{ font-size: 140px; color: #E6EBEF; font-weight: normal; font-style: italic; display: block; position: absolute; top: 0; left: 0 ; right: 0; z-index: -4; }
#contact h1.ttl::after{ content: ""; display: block; width: 120px; height: 1px; border-bottom: 2px solid #263270; position: absolute; bottom: -15px; left: 0; right: 0; margin: 0 auto; }
#contact h2.ttl02{font-size: 22px; font-weight: bold; }
#contact h2.ttl02.form_ttl{padding-top: 100px;}

#contact .tel_box{
	padding-top: 10px;
	margin-bottom: 10px;
}
#contact .tel_box .caption{
	margin-bottom: 20px;
}
#contact .tel_box_in{
	box-sizing: border-box;
	background: #FFF;
	padding: 20px;
	text-align: center;
    border: 1px solid #CCC;
	border-radius: 5px; 
}
#contact .tel_box_in a{
    color: #222;
    cursor: default;
}

#contact .tel_box_in .campaign{
    font-weight: bold;
    font-size: 20px;
    color: #C00;
}
#contact .tel_box_in .name{
	width: 200px;
	margin: 0 auto 20px auto;
}
#contact .tel_box_in .tel_no{
	font-size: 260%;
	font-family: Arial, Roboto, Meiryo, sans-serif;
	margin-bottom: 10px;
}
#contact .tel_box_in .tel_no img{
	width: 50px;
	height: auto;
	margin-right: 5px;
}
#contact .tel_box_in span{
	display: inline-block;
	width: 315px;
	border: 1px solid #900;
	color: #900;
	padding: 5px;
	margin-bottom: 8px;
	line-height: 1em;
	font-weight: bold;
}
@media screen and (max-width:1579px){
    #contact{padding-top: 50px;  }
}
@media screen and (max-width:767px){
    #contact .content_in main{padding-top: 30px; }
    #contact h1.ttl{ font-size: 24px; padding-top: 20px; margin-bottom: 60px; }
    #contact h1.ttl span{ font-size: 60px; }
    #contact h2.ttl02{font-size: 20px; font-weight: bold; margin-bottom: 10px; text-align: center; }
    #contact h2.ttl02.form_ttl{padding-top: 80px;}
    
    #contact .tel_box_in{ padding: 15px; }
    #contact .tel_box{ margin-bottom: 0px; }
    #contact .tel_box_in .name{width: 160px; margin: 0 auto 10px auto;}
    #contact .tel_box_in .tel_no{ font-size: 30px; margin-bottom: 10px; }
    #contact .tel_box_in .tel_no img{ width: 30px;padding-bottom: 5px; }
    #contact .tel_box_in span{ width: 90% }
}