@charset "utf-8";

/*---home-----------------------------------------------------------------*/

/*keyVisual*/
#keyVisual { background: #F1F5F9;}
#keyVisual .bg00 { background-size: auto,cover; height: 540px; display:flex; flex-direction:column; justify-content:center;}
/*#keyVisual .bg01 { background: url("../img/slide/01/001.png") no-repeat 70% 50%, url("../img/slide/01/002.png") no-repeat 100% 50% #F1F5F9; background-size: auto,cover; height: 540px; display:flex; flex-direction:column; justify-content:center;}
#keyVisual .bg02 { background: url("../img/slide/02/001.png") no-repeat 70% 50%, url("../img/slide/02/002.png") no-repeat 100% 50% #F1F5F9; background-size: auto,cover; height: 540px; display:flex; flex-direction:column; justify-content:center;}
#keyVisual .bg03 { background: url("../img/slide/03/001.png") no-repeat 70% 50%, url("../img/slide/03/002.png") no-repeat 100% 50% #F1F5F9; background-size: auto,cover; height: 540px; display:flex; flex-direction:column; justify-content:center;}*/
#keyVisual .inner { width: 1120px; margin: 0 auto; padding: 0; text-align: left; display: flex; flex-direction: column;}
@media screen and (max-width:1180px) {
    #keyVisual .inner { width: 94%;}
}



#keyVisual .inner img { display:inline-block!important; margin-top: -4px;}
#keyVisual h2 { margin: 0 0 40px 0; padding: 0; font-size: 36px; line-height: 140%; font-weight: 600; order: 2;}
#keyVisual h2 span { margin:5px 0 0 0; padding: 0; font-size: 15px; line-height: 160%; display: block; font-weight: 600;}
#keyVisual h3 { margin: 0 0 40px 0; padding: 0; font-size: 18px; line-height: 100%; order: 1; font-weight: bold;}
#keyVisual h3 span { margin: 0 0 5px 0; padding: 0; font-size: 12px; line-height: 100%; display: block; font-weight: 600;}
#keyVisual h3 img {  vertical-align: middle; margin: 0 0 0 5px; padding: 0; font-size: 1%; line-height: 1%;}
#keyVisual h4 {margin: 0 0 30px 0; padding: 0; font-size: 13px; line-height: 200%; order: 3; font-weight: 600;}
#keyVisual a.btn_more { margin: 0; padding: 0; line-height: 100%; display: block; background: url("../img/arw/arw_w.svg") no-repeat 95% 50% #296CA0; background-size: 10px 10px; -webkit-border-radius:3px; border-radius:3px; order: 4; width: 140px; height: 40px; display:flex; flex-direction:column; justify-content:center; align-items:center; }
#keyVisual a.btn_more span { color: #fff; font-size: 13px; line-height: 100%; margin: 0; padding: 0; position: relative;  font-weight: 500;}
@media screen and (max-width:1180px){
    #keyVisual .bg00{ background-position:95% 50%,100% 50%;  background-size: 60%,cover;}
    /*#keyVisual .bg01 { background-position:95% 50%,100% 50%;  background-size: 60%,cover;}
    #keyVisual .bg02 { background-position:95% 50%,100% 50%;  background-size: 60%,cover;}
    #keyVisual .bg03 { background-position:95% 50%,100% 50%;  background-size: 60%,cover;}*/
}
@media screen and (max-width:768px){
    #keyVisual { height: auto;}
    #keyVisual .inner { width:90%; padding: 270px 0 20px 0}
    #keyVisual .bg00 { background-position: 50% 20px!important; background-color:#F1F5F9!important; background-size:auto 260px!important; height: auto!important;}
    /*#keyVisual .bg01 { background: url("../img/slide/01/001.png") no-repeat 50% 20px #F1F5F9; background-size:auto 260px; height: auto;}
    #keyVisual .bg02 { background: url("../img/slide/02/001.png") no-repeat 50% 20px #F1F5F9; background-size:auto 260px; height: auto;}
    #keyVisual .bg03 { background: url("../img/slide/03/001.png") no-repeat 50% 20px #F1F5F9; background-size:auto 260px; height: auto;}*/
    #keyVisual h2 { margin: 0 0 15px 0; font-size: 28px; line-height: 125%;}
    #keyVisual h3 { margin: 0 0 10px 0; font-size: 16px; line-height: 160%;}
    #keyVisual h3 span { font-size: 11px;}
    #keyVisual h4 {margin: 0 0 20px 0; font-size: 12px; line-height: 160%; font-weight: normal;}
    #keyVisual a.btn_more {  width:100%;}
}


/*コンテンツ調整*/
h2.title { font-size: 24px; line-height: 100%; text-align: center; font-weight: 500; margin:0 auto 40px;}
h2.title2 { font-size: 24px; line-height: 100%; font-weight: 500; margin:0 auto 30px;}
@media screen and (max-width:768px){
    h2.title.wrapper1 { text-align:left; margin:0 auto 20px!important;}
}

/*ピックアップ*/
#home_pickup .wrapper1 { margin-bottom: 40px;}
a.home_pickup { width: 256px; color: #333;}
.home_pickup_ph { background: #F1F5F9; width: 256px; height: 180px; display:flex; flex-direction:column; justify-content:center; align-items:center; position: relative; margin: 0 auto 15px; line-height: 1%; font-size: 1%}
.home_pickup h2 { font-size: 14px; font-weight: 500; line-height: 160%; margin: 0; padding: 0;}
#home_pickup a.a_btn { display: block; width: 352px; height: 50px; background: url("../img/arw/arw_w.svg") no-repeat 95% 50% #296CA0; background-size: 15px 15px; -webkit-border-radius:3px; border-radius:3px; margin: 0 auto; display:flex; flex-direction:column; justify-content:center; align-items:center;}
#home_pickup a.a_btn span { color: #fff; font-weight: 500; line-height: 100%; position: relative; display: block;}
#home_pickup a.a_btn span:before {content:""; background: url("../img/icon/icon_list.svg") no-repeat 50% 50%; width: 20px; height: 20px; margin: 0; padding: 0; line-height: 1%; font-size: 1%; position: absolute; left: -40px; top: -1px;}
@media screen and (max-width:1180px) {
    a.home_pickup { /*width: 256px;*/ width: 48%; color: #333; margin-bottom: 40px;}
    .home_pickup_ph { width: 100%; height:220px; margin: 0 auto 10px; padding: 25px;}
}
@media screen and (max-width:580px){
    #home_pickup .wrapper1 { margin-bottom: 20px;}
    a.home_pickup { width:48%; margin-bottom: 20px;}
    a.home_pickup:nth-child(3),
    a.home_pickup:nth-child(4){ margin-bottom: 0;}
    .home_pickup_ph { width: 100%; height:160px; margin: 0 auto 10px; padding: 25px;}
    .home_pickup_ph img { max-width: 100%; height: auto;}
    #home_pickup a.a_btn { width:90%;}
}


/*事例*/
#home_Case .wrapper1 { margin-bottom: 40px;}
a.home_case { width: 256px; color: #333; background: #F1F5F9; margin-left: 25px;}
a.home_case:first-of-type { width: 256px; color: #333; background: #F1F5F9; margin-left: 0;}
@media screen and (max-width:1180px) {
    a.home_case { width: 24%; margin-left: 1%}
    a.home_case:first-of-type { width: 24%;  margin-left: 0;}
}
.home_case_ph { margin: 0 0 20px 0; padding: 0;  line-height: 1%; font-size: 1%}
.home_case h2 { font-size: 16px; font-weight: 500; line-height: 160%; margin: 0 0 10px 0; padding: 0 20px;}
.home_case p { font-size: 12px; font-family: 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, "sans-serif"; color: #666; padding:0 20px; line-height: 200%;}
#home_Case a.a_btn { display: block; width: 352px; height: 50px; background: url("../img/arw/arw_w.svg") no-repeat 95% 50% #296CA0; background-size: 15px 15px; -webkit-border-radius:3px; border-radius:3px; margin: 0 auto; display:flex; flex-direction:column; justify-content:center; align-items:center;}
#home_Case a.a_btn span { color: #fff; font-weight: 500; line-height: 100%; position: relative; display: block;}
@media screen and (max-width:768px){
    a.home_case { width: 48%; margin: 0 1% 20px;}
    a.home_case:first-of-type { width:48%; margin: 0 1% 20px;}
    .home_case_ph img { width: 100%; height: auto;}
    #home_Case a.a_btn { width:90%;}
    #home_Case .wrapper1 { margin-bottom:0px;}
}
@media screen and (max-width:580px){
    a.home_case { width: 100%; margin: 0;}
    a.home_case:first-of-type { width:100%; margin:0;}
    #home_Case .wrapper1 { margin-bottom:60px;}
}

/*インフォメーション*/
#home_Info { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; justify-content:space-between; margin-bottom: 80px;}
#home_InfoL { width:544px;}
#home_InfoR { width:544px;}
@media screen and (max-width:1180px) {
    #home_InfoL { width:48%;}
    #home_InfoR { width:48%;}
}
#home_Info ul { border-top:1px solid #ddd; margin: 0 0 20px 0; padding: 0;}
#home_Info ul li { border-bottom:1px solid #ddd; padding: 20px 0 16px;}
#home_Info ul li span { display: block; font-size: 10px; color: #808080; line-height: 100%; margin-bottom: 5px;}
#home_Info ul li a { line-height: 160%;}
@media screen and (max-width:768px){
    #home_Info { margin-bottom: 40px;}
    #home_Info h2.title2 { margin-bottom: 20px;}
    #home_InfoL { width:100%; margin-bottom: 30px;}
    #home_InfoR { width:100%;}
    #home_Info ul li { padding: 15px 0 11px;}
}

/*バナー*/
#home_Bnr { /*border-top:1px solid #ccc;*/ padding: 0px 0 80px;}
#home_Bnr a { display:block; margin: 20px 0 0 0; padding: 0; line-height: 1%; font-size: 1%;}
#home_Bnr .wrapper1 div { width:32%;}
#home_Bnr .wrapper1:after{ content:""; display:block; width:32%; height:0;}
#home_Bnr .wrapper2 div { width:448px;}

@media screen and (max-width:1180px) {
    #home_Bnr .wrapper2 div { width:48%;}
    #home_Bnr img { width:100%; height: auto;}
}
@media screen and (max-width:900px) {
	#home_Bnr .wrapper1 div { width:48%;}
	#home_Bnr .wrapper1:after{ content:""; display:block; width:48%; height:0;}
}

@media screen and (max-width:560px){
    #home_Bnr { padding: 0px 0 40px;}
    #home_Bnr .wrapper2 div { width:100%;}
	#home_Bnr .wrapper1 div { width:100%;}
    #home_Bnr a { margin-top: 10px;}
}