@charset "UTF-8";

/*	cmn_undernavi
------------------------------------------------------------ */
@media only screen and (max-width:767px){
.cmn_undernavi { display: none;; }
}

/*	home_title
------------------------------------------------------------ */
.home_title { background-color: #15aca3; overflow: hidden; }
.home_title .title_heading { font-size: 0; line-height: 0; margin: 0 -17.5%; }
.home_title .title_heading img { width: 100%; }
@media only screen and (max-width:767px){
.home_title .title_heading { margin: 0 -17px; }
}

/*	home_whats
------------------------------------------------------------ */
.home_whats { background-color: #eeeeee; padding: 100px 0 80px 0; }
.home_whats .whats_heading { font-size: 0; line-height: 0; position: absolute; top: -80px; left: 0px; margin: -2.6666% 0 0 -1.0833%; width: 34.6666%; }
.home_whats .whats_heading img { width: 100%; }
.home_whats ul { display: flex; padding-left: 21.6666%; } /* 940px */
.home_whats ul li { -webkit-border-radius: 50%; border-radius: 50%; background-color: #007770; color: #ffffff; text-align: center; position: relative; padding-bottom: 19.1489%; width: 19.1489%; } /* 180px */
.home_whats ul li + li { margin-left: 1.0638%; }
.home_whats ul li dl { position: absolute; top: 0px; left: 0px; width: 100%; }
.home_whats ul li dl dt { font-size: 0; line-height: 0; padding: 10.5555% 0 6.6666% 0; }
.home_whats ul li dl dt img { width: 43.3333%; }
.home_whats ul li dl dd { font-size: 1.2841vw; line-height: 1.3; }
@media only screen and (min-width:1246px){
.home_whats ul li dl dd { font-size: 100%; }
}
@media only screen and (max-width:767px){
.home_whats { padding: 12.5% 0 40px 0; }
.home_whats .whats_heading { position: absolute; top: 0px; left: 0px; margin: -15.7894% 0 0 1.7482%; width: 73.7762%; }
.home_whats ul { flex-wrap: wrap; padding-left: 0; }
.home_whats ul li { padding-bottom: calc(50% - 8px); width: calc(50% - 8px); }
.home_whats ul li + li { margin-left: 0; }
.home_whats ul li:nth-of-type(odd) { margin-left: 16px; }
.home_whats ul li:nth-of-type(1) { margin-left: calc(50% + 8px); }
.home_whats ul li:nth-of-type(n+2) { margin-top: 16px; }
.home_whats ul li dl dt { padding: 12.2222% 0 5.5555% 0; }
.home_whats ul li dl dt img { width: 42.9629%; }
.home_whats ul li dl dd { font-size: 3.75vw; }
}

/*	home_anchor
------------------------------------------------------------ */
.home_anchor { background-color: #00524d; padding: 10px 0; }
.home_anchor .anchor_list { display: flex; margin: 0 -10px; }
.home_anchor .anchor_list a { -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #00524d; color: #ffffff; display: block; text-align: center; position: relative; margin: 0 10px; padding: 20px 0 50px 0; width: calc(25% - 20px); }
.home_anchor .anchor_list a:hover { text-decoration: none; }
.home_anchor .anchor_list a::after { background: url(/chovicon/common/img/arw_anchor.png) no-repeat; background-size: cover; content: ""; position: absolute; left: calc(50% - 14px); bottom: 10px; width: 28px; height: 16px; }
.home_anchor .anchor_list a dt { font-weight: 700; }
.home_anchor .anchor_list a dt small { display: block; font-size: 93.75%; }
.home_anchor .anchor_list a dt span { display: block; font-size: 137.5%; line-height: 1.4; }
.home_anchor .anchor_list a dd { font-size: 0; line-height: 0; margin-top: 15px; }
.home_anchor .anchor_list a dd img { width: 112px; }
@media only screen and (min-width:768px){
.home_anchor .anchor_list a { -webkit-transition: background-color 0.3s ease,color 0.3s ease; transition: background-color 0.3s ease,color 0.3s ease; }
.home_anchor .anchor_list a:hover { background-color: #efecb9; color: #00524d; }
.home_anchor .anchor_list a:hover::after { background: url(/chovicon/common/img/arw_anchor_ov.png) no-repeat; background-size: cover; }
}
@media only screen and (max-width:767px){
.home_anchor { padding: 25px 0 20px 0; }
.home_anchor .anchor_list { flex-wrap: wrap; margin: 0; }
.home_anchor .anchor_list a { margin: 0; padding: 25px 0 30px 0; width: 50%; }
.home_anchor .anchor_list a:nth-of-type(even)::before { background-color: #1a645f; content: ""; position: absolute; top: calc(50% - 33px); left: 0px; width: 1px; height: 66px; }
.home_anchor .anchor_list a::after { left: calc(50% - 10px); bottom: 13px; width: 19px; height: 11px; }
.home_anchor .anchor_list a:nth-of-type(n+3) dl { position: relative; }
.home_anchor .anchor_list a:nth-of-type(n+3) dl::before { background-color: #1a645f; content: ""; position: absolute; top: -25px; left: calc(50% - 43px); width: 86px; height: 1px; }
.home_anchor .anchor_list a dt small { font-size: 81.25%; }
.home_anchor .anchor_list a dt span { font-size: 106.25%; }
.home_anchor .anchor_list a dd { margin-top: 5px; }
.home_anchor .anchor_list a dd img { width: 80px; }
}

/*	home_cando
------------------------------------------------------------ */
.home_cando { background-color: #6bcec8; overflow: hidden; padding: 70px 0 60px 0; }
.home_cando .container { z-index: +1; }
.home_cando .cmn_heading_A { position: relative; }
.home_cando .cmn_heading_A::after { background: url(/chovicon/img/char_cando.png) no-repeat; background-size: cover; content: ""; position: absolute; top: 0px; right: 0px; margin-top: -25px; width: 190px; height: 211px; z-index: -1; }
.home_cando .cando_heading { background-size: cover; background-position: center center; color: #ffffff; font-size: 212.5%; font-weight: 700; text-align: center; padding: 45px 0 135px 0; }
.home_cando .cando_heading.oCase_A { background-image: url(/chovicon/img/bg_cando_01.jpg); }
.home_cando .cando_heading.oCase_B { background-image: url(/chovicon/img/bg_cando_02.jpg); }
.home_cando .cando_heading.oCase_C { background-image: url(/chovicon/img/bg_cando_03.jpg); }
.home_cando .cando_heading.oCase_D { background-image: url(/chovicon/img/bg_cando_04.jpg); }
.home_cando .cando_heading.oCase_E { background-image: url(/chovicon/img/bg_cando_05.jpg); }
.home_cando .cando_mid { display: flex; justify-content: space-between; }
.home_cando .cando_mid li { width: 48.3333%; }
.home_cando .cando_mid li p:nth-of-type(1) { -webkit-border-radius: 30px; border-radius: 30px; background-color: #ffffff; color: #00625c; font-size: 125%; font-weight: 700; line-height: 60px; text-align: center; }
.home_cando .cando_menu { margin-left: -2px; margin-right: -2px; }
.home_cando .cando_type { display: flex; justify-content: space-between; }
.home_cando .cando_type dl { width: 31.3333%; }
.home_cando .cando_type dl dt { background-color: #00625c; color: #ffffff; font-size: 125%; font-weight: 700; line-height: 1.4; text-align: center; padding: 5px 0; }
.home_cando .cando_type dl:nth-of-type(3) dt { background-color: #efecb9; color: #000000; }
.home_cando .cando_type dl dd { margin-top: 15px; }
.home_cando .cando_type dl:nth-of-type(3) dd { background-color: #ffffff; margin-top: 0; padding: 15px 20px; }
.home_cando .cando_type dl dd li { position: relative; padding-left: 20px; }
.home_cando .cando_type dl dd li::before { -webkit-border-radius: 50%; border-radius: 50%; background-color: #000000; content: ""; position: absolute; top: calc(0.94em - 5px); left: 2px; width: 10px; height: 10px; }
.home_cando .cando_incidental { text-align: center; }
.home_cando .cando_incidental dt { -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; background-color: #efecb9; font-size: 125%; font-weight: 700; line-height: 1.4; padding: 10px 0; }
.home_cando .cando_incidental dd { -webkit-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; background-color: #ffffff; padding: 25px; }
.home_cando .cando_incidental dd p:nth-of-type(1) { font-size: 125%; }
.home_cando .cando_incidental dd p:nth-of-type(2) { color: #cc0000; }
.home_cando .cando_case { margin-top: 25px; }
.home_cando .cando_case + .cando_case { margin-top: 60px; }
.home_cando .cando_photos { overflow: hidden; margin-top: -90px; }
.home_cando .cando_photos ul { display: flex; flex-wrap: wrap; margin: -10px -5px 0 -5px; }
.home_cando .cando_photos ul li { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 10px 5px 0 5px; width: 50%; }
@media only screen and (max-width:767px){
.home_cando { padding: 35px 0 40px 0; }
.home_cando .cmn_heading_A::after { display: none; }
.home_cando .cando_heading { font-size: 143.75%; padding: 25px 0 70px 0; }
.home_cando .cando_mid { display: block; }
.home_cando .cando_mid li { width: auto; }
.home_cando .cando_mid li:nth-of-type(2) { margin-top: 20px; }
.home_cando .cando_mid li p:nth-of-type(1) { -webkit-border-radius: 20px; border-radius: 20px; font-size: 112.5%; line-height: 40px; }
.home_cando .cando_menu { margin-left: 0; margin-right: 0; }
.home_cando .cando_type { display: block; }
.home_cando .cando_type dl { width: auto; }
.home_cando .cando_type dl + dl { margin-top: 20px; }
.home_cando .cando_type dl:nth-of-type(3) { margin-bottom: 25px; }
.home_cando .cando_type dl dt { font-size: 112.5%; padding: 5px 0; }
.home_cando .cando_type dl dd li::before { top: calc(0.8em - 5px); }
.home_cando .cando_incidental dt { font-size: 112.5%; padding: 10px 0; }
.home_cando .cando_incidental dd { line-height: 1.4; padding: 15px; }
.home_cando .cando_incidental dd p:nth-of-type(1) { font-size: 112.5%; }
.home_cando .cando_incidental dd p:nth-of-type(2) { text-align: left; position: relative; padding-left: 1em; margin-top: 10px; }
.home_cando .cando_incidental dd p:nth-of-type(2) span { position: absolute; top: 0px; left: 0px; }
.home_cando .cando_case { margin-top: 15px; }
.home_cando .cando_case + .cando_case { margin-top: 45px; }
.home_cando .cando_photos { margin-top: -40px; }
.home_cando .cando_photos ul { display: block; margin: 0; }
.home_cando .cando_photos ul li {  padding: 0; width: auto; }
.home_cando .cando_photos ul li:nth-of-type(n+2) { margin-top: 10px; }
}

/*	home_point
------------------------------------------------------------ */
.home_point { background-color: #eeeeee; padding: 70px 0; }
.home_point .cmn_heading_A { position: relative; z-index: +2; }
.home_point .cmn_heading_A::after { background: url(/chovicon/img/char_point.png) no-repeat; background-size: cover; content: ""; position: absolute; top: 0px; left: 0px; margin-top: 75px; width: 232px; height: 244px; z-index: -1; }
.home_point .cmn_heading_B,
.home_point .cmn_heading_B + p { position: relative; z-index: +3; }
.home_point .point_note { background-color: #ffffff; border: 4px solid #00524d; font-size: 160.625%; font-weight: 700; line-height: 1.4; text-align: center; position: relative; padding: 30px 205px; }
.home_point .point_note::after { background: url(/chovicon/img/char_point_02.png) no-repeat; background-size:cover; content: ""; position: absolute; bottom: 0px; left: 40px; width: 144px; height: 138px; }
.home_point .point_note span { color: #cc0000; font-size: 120.0778%; }
.home_point .point_support { overflow: hidden; }
.home_point .point_support ul { display: flex; justify-content: space-between; margin: 0 -20px; }
.home_point .point_support ul li { margin: 0 20px; width: calc(33.3333% - 40px); }
.home_point .point_support ul li dt { color: #00625c; font-size: 125%; font-weight: bold; line-height: 1.4; text-align: center; padding: 0 8%; }
.home_point .point_support ul li dt span { background: url(/chovicon/img/bg_point_left.png) left center no-repeat,url(/chovicon/img/bg_point_right.png) right center no-repeat; background-size: 28px 44px,28px 44px; display: block; padding: 0 40px; }
.home_point .point_support ul li dd { background-color: #00625c; color: #efecb9; font-size: 125%; font-weight: bold; line-height: 1.4; text-align: center; margin-top: 10px; padding: 5px; }
.home_point .point_support ul li dd span { font-size: 150%; }
.home_point .point_support ul li p { margin-top: 15px; }
@media only screen and (max-width:767px){
.home_point { padding: 35px 0; }
.home_point .cmn_heading_A::after { display: none; }
.home_point .point_note { font-size: 100%; text-align: left; padding: 10px 5px 10px 85px; }
.home_point .point_note::after { left: -10px; width: 89px; height: 83px; }
.home_point .point_note span { font-size: 125%; }
.home_point .point_support ul { display: block; margin: 0; }
.home_point .point_support ul li { margin: 0; width: auto; }
.home_point .point_support ul li + li { margin-top: 20px; }
.home_point .point_support ul li dt { font-size: 100%; padding: 0 30px; }
.home_point .point_support ul li dt span { background-size: 21px 34px,21px 34px; padding: 0 30px; }
.home_point .point_support ul li dd { font-size: 100%; margin-top: 10px; padding: 5px; }
.home_point .point_support ul li dd span { font-size: 143.75%; }
.home_point .point_support ul li p { margin-top: 15px; }
}

/*	home_flow
------------------------------------------------------------ */
.home_flow { background-color: #6bcec8; padding: 70px 0 80px 0; }
.home_flow .cmn_heading_A { position: relative; z-index: +2; }
.home_flow .cmn_heading_A::after { background: url(/chovicon/img/char_flow.png) no-repeat; background-size: cover; content: ""; position: absolute; top: 0px; right: 0px; margin-top: -20px; width: 292px; height: 260px; z-index: -1; }
@media only screen and (max-width:767px){
.home_flow { padding: 35px 0 40px 0; }
.home_flow .cmn_heading_A::after { display: none; }
.home_flow .cmn_img { margin-right: -2.9668%; }
}

/*	home_proposal
------------------------------------------------------------ */
.home_proposal { background: url(/chovicon/img/bg_proposal.jpg) center center no-repeat; background-size: cover; padding: 70px 0 80px 0; }
.home_proposal .cmn_heading_A { position: relative; z-index: +2; }
.home_proposal .cmn_heading_A::after { background: url(/chovicon/img/char_proposal.png) no-repeat; background-size: cover; content: ""; position: absolute; top: 0px; right: 0px; margin-top: -60px; width: 210px; height: 194px; z-index: -1; }
.home_proposal .proposal_links { display: flex; justify-content: space-between; margin-right: -20px; margin-left: -20px; }
.home_proposal .proposal_links a { background-color: #00524d; color: #efecb9; display: block; font-size: 125%; line-height: 1.4; text-align: center; margin: 0 20px; padding: 5px; width: 25%; }
.home_proposal .proposal_links a:hover { text-decoration: none; }
.home_proposal .proposal_links a dd { padding: 15px 15px 10px 15px; }
.home_proposal .proposal_links a dd span { display: block; position: relative; padding: 0 20px; }
.home_proposal .proposal_links a dd span::after { background: url(/chovicon/common/img/arw_link_01.png) left center no-repeat; background-size: cover; content: ""; position: absolute; top: calc(0.7em - 6px); left: 0px; width: 8px; height: 13px; }
@media only screen and (min-width:768px){
.home_proposal .proposal_links a { -webkit-transition: background-color 0.3s ease,color 0.3s ease; transition: background-color 0.3s ease,color 0.3s ease; }
.home_proposal .proposal_links a:hover { background-color: #15aca3; color: #ffffff; }
.home_proposal .proposal_links a:hover span::after { background: url(/chovicon/common/img/arw_link_03.png) left center no-repeat; background-size: 8px 13px; }
}
@media only screen and (max-width:767px){
.home_proposal { background: url(/chovicon/img/bg_proposal_sp.jpg) left top no-repeat; background-size: 100% auto; padding: 35px 0 40px 0; }
.home_proposal .cmn_heading_A::after { display: none; }
.home_proposal .proposal_links { display: block; margin-right: 0; margin-left: 0; }
.home_proposal .proposal_links a { font-size: 150%; margin: 0; padding: 5px; width: auto; }
.home_proposal .proposal_links a + a { margin-top: 20px; }
.home_proposal .proposal_links a dd { padding: 15px 15px 10px 15px; }
.home_proposal .proposal_links a dd span {  padding: 0 20px; }
.home_proposal .proposal_links a dd span::after { top: calc(50% - 7px); width: 9px; height: 14px; }
}



/*	demand_top
------------------------------------------------------------ */
.sp-style{
    display: none;
}
#top-wrap{
    height: 380px;
    max-width: 980px;
    margin: 80px auto 0;
    background: url(../img/demand-top.jpg) no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}
#top-wrap #top-text{
    background: rgba(0, 0, 0, 0.7);
    width: 620px;
    height: 170px;
    color:#fff;
    position: relative;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}
#top-text::before{
    content: "";
    top:0;
    left:0;
    border-bottom: 94px solid transparent;
    border-left:94px solid #cc0000;
    position: absolute;
    z-index: 1;
}
#top-text #top-text-inner{
    z-index: 2;
}
#top-text-inner strong{
    display: inline-block;
    letter-spacing: 0.1em;
    padding-bottom: 5px;
    margin-bottom: 10px;
    font-size: 18px;
    border-bottom: 1px solid #fff;
}
#top-text h1{
    font-size: 42px;
    letter-spacing: 0.1em;
    font-weight: bold;
    margin-top: 18px;
    line-height: 40px;
    margin: 0;
    padding:0;
}
#demand-wrap{
    max-width: 980px;
    width: 100%;
    margin: 0 auto 102px;
}
#demand-wrap .tt01 {
    background-color: #ddd;
    font-size: 16px;
    font-weight: bold;
    width: 100%;
    max-width: 100%;
    padding: 5px;
    margin: 30px auto;
}
#demand-wrap h2{
    font-size:29px;
    border-left:12px solid #FF0000;
    background-color: #464543;
    color:#fff;
    height: 65px;
    line-height: 65px;
    padding-left:1.5%;
    margin: 0 0 50px;
}
#demand-wrap h3{
    font-size:24px;
    font-weight: bold;
}
.link-text{
    font-size:14px;
    font-weight: bold;
    display: block;
    text-align: center;
    padding:15px 0 0;
}
.link-text a{
    color: #D80000;
    text-decoration: none;    
}
.link-text a:visited{
    color: #D80000;
    text-decoration: none;
}
.link-text a:hover{
    color: #D80000;
    text-decoration: underline;
}
#demand-lead{
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    line-height: 150%;
    margin: 50px 0 40px 0;
}
.box-wrap-outer{
    background-color: #eee;
    padding:0 2%;
    width: 100%;
    margin: 0 auto;
}
.box-wrap:nth-of-type(2){
    border-top:1px #111 solid;
    padding-top:0;
    margin-top:40px;
    margin-bottom: 70px;
}
.box-wrap{
    background-color: #eee;
    padding: 0 2px 2px;
}
.box-wrap-inner{
    max-width: 980px;
    width: 100%;
    display: flex;
    justify-content: center;
    padding:0;
    margin-bottom: 0.5%;
}
.box-wrap .box01-title{
    padding: 40px 0 2%;
    text-align: center;
    background-color: #eeeeee;    
}
.box01-title h3{
    margin: 0;
    padding:0;
    font-size: 22px;
    line-height: 30px;
}
.box01 .tt01{
    margin-top:2%;
}
.box01-title strong{
    color: #cc0000;
}
.box01-title ul{
    margin: 2% 0 0;
    padding:0;
    display: flex;
    justify-content: center;
}
.box01-title li{
    list-style: none;
    margin-bottom: 15px;
    width: 150px;
    border: 1px solid #222;
    text-align: center;
    line-height: 2.5em;
    margin-right: 1.2em;
    background-color: #fff;
}
.box01-title li:last-child{
    margin-right: 0;   
}

.box-wrap .box01{
    /*width: 20%;*/
    height: auto;
    padding:2% 0 0 2%;
    background-color: #4D4D4D;
}
.box01 .box01-up{
    padding: 0;
    display: flex;
    justify-content: space-between;

}
.box01-up img{
    width: 150px;
}
.box01-bottom{
    width: 100%;
    color: #222;
    padding: 2% 2% 0 2%;
    background-color: #4D4D4D;
}
.box01-bottom h3{
    font-size:20px;
    line-height: 20px;
    margin:0 0 8px 0;
    padding:0;
    text-align: center;
}
.box01-bottom .box01-bottom-inner{
    display: flex;
    flex-wrap: wrap;
}

.box01-bottom .box01-bottom-inner div{
    width: 160px;
    text-align: center;
    padding: 0 0 6%;
    color:#fff;
}
.box01-bottom .box01-bottom-inner div span{
    font-weight: bold;
    font-size:13px;
    line-height:120%;
}

.box01-bottom .box01-bottom-inner div img{
    width: 100%;
}

.box01-bottom .box01-bottom-inner div .js-modal-open{
  position: relative;
  display: block;
  cursor:pointer;
}

.box01-bottom .box01-bottom-inner div .mv-icon{
    position: absolute;
    width: 40px;
    top: calc(50% - 30px);
    right: calc(50% - 20px);
    padding: 0;
}
.box01-bottom .box01-bottom-inner div .mv-time{
    position: absolute;
    width: 100%;
    bottom: 10px;
    padding: 0;
    background-color: #000;
    opacity: 0.7;
    color: #fff;
    font-size:12px;
}
.box01-bottom .box01-bottom-inner div .mv-icon img{
    width: 100%;
}

/* .box01-bottom .box01-bottom-inner div:nth-child(2),
.box01-bottom .box01-bottom-inner div:nth-child(5){
  margin: 0 5% 0;
} */
.box01-bottom .box01-bottom-inner div{
    margin-right: 1.2rem;
}
.box01-bottom .box01-bottom-inner div:last-child{
    margin-right: 0;
}

    .box01 p {
    padding: 0;
    padding-left: 0px;
    display: flex;
    justify-content: space-between;
    padding-left: 10%;
    }
.modal{
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  width: 100%;
}

.modal__bg{
  background: rgba(0,0,0,0.8);
  height: 100vh;
  position: absolute;
  width: 100%;
}
.modal__content{
  left: 50%;
  position: absolute;
  padding: 30px 0 0;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 60%;
}

.close-btn {
  position: absolute;
    right: 0;
    top: 0;
    width: 35px;
    height: 35px;
    background-image: url(../img/modal-close.png);
    background-repeat: no-repeat;
}

.mv{
  height: auto;
  width: 100%;
  display: block;
}

.btn-demand-inq{
  display: block;
  width: 540px;
  height: 54px;
  background:#cc0000 url(../img/arrow-wh.png) 3% 50% no-repeat;
  line-height: 54px;
  margin: 0 auto;
  border-radius: 5px;
  font-weight: bold;
  text-align: center;
  color:#fff;
  font-size:23px;
}
.btn-demand-inq.large{
    width: 100%;
    margin: 20px 0 50px;
}
.btn-demand-inq.medium{
    width: 80%;
    margin: 20px auto 50px;
}
.btn-demand-inq:link{
    text-decoration: none;
    color: #fff;
}

.btn-demand-inq:visited{
  text-decoration: none;
  color: #fff;
}

.btn-demand-inq:hover{
    background-color: #BF000F;
    color:#fff;
}

.tt02 {
    font-size: 24px;
	display: flex;
	align-items: center;
}
.tt02:before,
.tt02:after {
	border-top: 5px solid #cc0000;
	content: "";
	flex-grow: 1;
}
.tt02:before {
	margin-right: 1rem;
}
.tt02:after {
	margin-left: 1rem;
}

.box02-wrap{
	max-width: 980px;
	display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 50px;
}
.box02-wrap.last-box{
    margin-bottom: 70px;
}
.box02-wrap .box02-title {
    padding: 22px 5% 3%;
    height:100px;
    text-align: center;
    line-height: 200%;
}
.box02-title h2 {
    margin: 0;
    margin-bottom: 0px;
    padding: 0;
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 10px;
}
.box02-title strong {
    color: #cc0000;
}
.box02{
	width: 46%;
    background-color: #eee;
    padding-bottom:20px;
}
.box02-up{
	padding: 2% 8% 5%;
	background-color: #eee;
}
.box02-up div{
    height: 150px;
}
.box02 .box02-bottom {
    width: 100%;
    height: auto;
    padding: 6% 6% 0;
    color: #fff;
    background-color: #4D4D4D;
}

.box02-bottom .box02-bottom-inner div {
    width: 100%;
    text-align: center;
    padding: 0 0 3%;
}
.box02-bottom .box02-bottom-inner div .js-modal-open {
    position: relative;
    display: block;
    cursor: pointer;
}
.box02-bottom .box02-bottom-inner div img {
    width: 100%;
}

.box02-bottom .box02-bottom-inner div .mv-icon {
    position: absolute;
    width: 40px;
    top: calc(50% - 30px);
    right: calc(50% - 20px);
    padding: 0;
}

.box02-bottom .box02-bottom-inner div .js-modal-open2 {
    position: relative;
    display: block;
    cursor: pointer;
}



.box02-bottom .box02-bottom-inner div .mv-icon img {
    width: 100%;
}
.box02-bottom .box02-bottom-inner div .mv-time {
    position: absolute;
    width: 100%;
    bottom: 10px;
    padding: 0;
    background-color: #000;
    opacity: 0.7;
    color: #fff;
    font-size: 12px;
}

.kiyaku-text{
	font-size:13px;	
}
.form-wrap iframe{
    width:100%;
    border:solid #ccc 1px;
}
.attention-txt{
	padding: 2px;
	font-size:10px;
	background-color: #f00;
	color:#fff;
	position: relative;
	right: 0;
}

@media screen and (max-width: 1024px) and (orientation: portrait){
    .sp-style{
        display: none;
    }
    #main .container {
        margin-right: 10px;
        margin-left: 10px;
    }
    #demand-wrap h2{
        font-size:2.9vw;
        border-left:12px solid #FF0000;
        background-color: #464543;
        color:#fff;
        width: 96%;
        height: 65px;
        line-height: 65px;
        padding-left:1.5%;
        margin: 0 auto 50px;
    }
    #demand-wrap h3{
        font-size:2.4vw;
        font-weight: bold;
    }
    .box-wrap-outer{
        background-color: #eee;
        padding:0 2%;
        width: 96%;
        margin: 0 auto;
    }
    .box-wrap {
        max-width: 100%;
        display: block;
        justify-content: space-between;
        margin-bottom: 50px;
        margin: 0 auto 50px;
    }
    .box-wrap .box01 {
        width: 48%;
        height: 570px;
        background-color: #eeeeee;
        position: relative;
        padding-top:5%;
    }
    .box01 .box01-up {
        padding: 0 0 0 10%;
        display: flex;
        justify-content: space-between;
    }
    .box01-up img {
        width: 87%;
    }
    .box01 .box01-up {
    padding: 0;
    padding-left: 0px;
    display: flex;
    justify-content: space-between;
    padding-left: 10%;
    }


    .box-wrap .box01 {
        width: 48%;
        height: 570px;
        background-color: #4D4D4D;
        position: relative;
        display: table-cell;
    }
    .box-wrap-inner {
        max-width: 980px;
        width: 96%;
        margin:0 auto;
        background-color: #4D4D4D;
    }
    .box01-bottom {
        width: 98%;
        color: #222;
        padding: 5% 2% 0 2%;
        background-color: #4D4D4D;
    }
    .box01-bottom .box01-bottom-inner div {
        width: 120px;
        text-align: center;
        padding: 0 0 6%;
        color: #fff;
    }    
    .box01-bottom .box01-bottom-inner div img {
        width: 100%;
    }
    .box02-wrap{
        width: 96%;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        margin-bottom: 50px;
    }
    .box02-wrap .box02-title{
        height:100px;
    }
    .box02-up div{
        height: 150px;
    }
    .btn-demand-inq.large{
        width: 90%;
        margin: 20px auto 50px;
    }
    .btn-demand-inq.medium{
        width: 80%;
        margin: 20px auto 50px;
    }
    /* #mainForm{
        width: 96%;
        margin: 0 auto;
    } */
    #mainForm-wrap{
        width: 96%;
        margin: 0 auto;
    }


@media only screen and (max-width:767px){
    .sp-style{
        display: block;
    }
    .pc-style{
        display: none;
    }
    #main .container {
        margin-right: 10px;
        margin-left: 10px;
    }
    #demand-wrap h2{
        font-size:4.53125vw;
        border-left:12px solid #FF0000;
        background-color: #464543;
        color:#fff;
        height: 65px;
        line-height: 65px;
        padding-left:1.5%;
        margin: 0 auto 50px;
        width: 90%;
    }
    #demand-wrap h3{
        font-size:4.375vw;
        font-weight: bold;
    }
    #top-wrap{
        width: 100%;
        height: auto;
        max-width: 100%;
        min-height: 285px;
        margin: 0 auto 0;
        background: url(../img/demand-top.jpg) no-repeat;
        background-size: cover;
        position: relative;
    }
    #top-wrap #top-text{
        background:rgba(0, 0, 0, 0.7);
        max-width: 90%;
        width: 650px;
        height: 120px;
        color:#fff;
        position: absolute;
        top:28%;
        right: 0;
        left: 0;
        margin: 0 auto;
        z-index: 0;
    }
    #top-text::before{
        content: "";
        top:0;
        left:0;
        border-bottom: 4em solid transparent;
        border-left:4em solid #cc0000;
        position: absolute;
        z-index: 1;
    }
    #top-text #top-text-inner{
        z-index: 2;
    }
    #top-text-inner strong{
        font-size:10px;
        letter-spacing: 0.1em;
        margin-bottom: 5px;
        display: flex;
        align-items: center;
    }
    #top-text-inner strong:after {
        border-top: 1px solid;
        content: "";
        flex-grow: 1;
    }
    #top-text-inner strong:after {
         margin-left: 2px;
    }
    #top-text h1{
        font-size: 23px;
        letter-spacing: 0.1em;
        line-height: 150%;
        font-weight: bold;
        margin-top: 0;
    }

    .modal__content{
      width: 90%;
    }
    .box-wrap-outer {
        background-color: #eee;
        padding: 0 2%;
        width: 90%;
        margin: 0 auto;
    }
    .box-wrap{
        max-width: 980px;
        display: block;
        margin-bottom: 50px;
    }
    .box-wrap .box01{
        max-width: 475px;
        width: 90%;
        margin: 0 auto;
        height: auto;
        display: block;
        background-color: #4d4d4d;
    }
    .box-wrap .box01:nth-child(2){
        margin-top: 50px;
    }
    .box-wrap-inner{
        width: 100%;
        display: block;
        justify-content: center;
        margin-bottom: 0; 
    }
    .box01 .box01-up{
        width: 100%;
        margin: 0 auto;
        padding: 5% 20%;
        display: block;
        text-align: center;
        background-color: #4D4D4D;    
    }
    .box01-up img{
        margin: 0 auto;
    }
    .box01-up ul{
        margin: 20px 0 0 0;
        padding:0;
    }
    .box01-up li{
        list-style: none;
        padding:2%;
        margin-bottom: 15px;
        width: 100%;
        border: 1px solid #222;
        text-align: center;
    }
    .box01 .box01-bottom{
        width: 100%;
        height: auto;
        padding: 6%;
        color:#fff;
        background-color: #4D4D4D;
    }
    .box01-bottom {
        width: 90%;
        margin:0 auto;
    }
    .box01-bottom h3 {
        font-size: 20px;
        line-height: 120%;
        margin: 0 0 8px 0;
        padding: 0;
    }
    .box01-bottom .box01-bottom-inner {
        width: 85%;
        display: flex;
        margin:0 auto;
    }
    .box01-bottom .box01-bottom-inner div {
        width: 40%;
        text-align: center;
    }
    .box01-bottom .box01-bottom-inner div .js-modal-open {
        width: 100%;
    }
    .btn-demand-inq{
        display: block;
        width: 90%;
        height: 54px;
        margin: 0 auto;
        background:#cc0000 url(../img/arrow-wh.png) 3% 50% no-repeat;
        line-height: 54px;
        margin: 0 auto;
        border-radius: 5px;
        font-weight: bold;
        text-align: center;
        color:#fff;
        font-size:23px;
    }
    .btn-demand-inq:link{
        text-decoration: none;
        color: #fff;
    }
    .btn-demand-inq:hover{
        background-color: #BF000F;
        color:#fff;
    }
    .tt02 {
        font-size: 20px;
        display: flex;
        align-items: center;
    }
    .tt02:before,
    .tt02:after {
        border-top: 5px solid #cc0000;
        content: "";
        flex-grow: 1;
    }
    .tt02:before {
        margin-right: 1rem;
    }
    .tt02:after {
        margin-left: 1rem;
    }
    
    .box02-wrap{
        max-width: 980px;
        display: block;
        justify-content: space-between;
        margin-bottom: 50px;
    }
    .box02-wrap .box02-title{
        height:auto;
    }
    .box02-up div{
        height:auto;
    }
    .box02-wrap .box02-title {
        padding: 3% 5%;
        text-align: center;
    }
    .box02-title h2 {
        margin: 0;
        margin-bottom: 0px;
        padding: 0;
        font-size: 22px;
        line-height: 30px;
        margin-bottom: 10px;
    }
    .box02-title strong {
        color: #cc0000;
    }
    .box02{
        width: 96%;
        margin: 3% auto 0;
        background-color: #eee;
        padding-bottom:15px;
    }
    .box02-up{
        padding: 2% 8% 5%;
        background-color: #eee;
    }
    .box02 .box02-bottom {
        width: 100%;
        height: auto;
        padding: 6% 6% 0;
        color: #fff;
        background-color: #4D4D4D;
    }
    
    .box02-bottom .box02-bottom-inner div {
        width: 100%;
        text-align: center;
        padding: 0 0 3%;
    }
    .box02-bottom .box02-bottom-inner div .js-modal-open {
        position: relative;
        display: block;
        cursor: pointer;
    }
    .box02-bottom .box02-bottom-inner div img {
        width: 100%;
    }
    
    .box02-bottom .box02-bottom-inner div .mv-icon {
        position: absolute;
        width: 40px;
        top: calc(50% - 30px);
        right: calc(50% - 20px);
        padding: 0;
    }
    .box02-bottom .box02-bottom-inner div .mv-icon img {
        width: 100%;
    }
    .box02-bottom .box02-bottom-inner div .mv-time {
        position: absolute;
        width: 100%;
        bottom: 10px;
        padding: 0;
        background-color: #000;
        opacity: 0.7;
        color: #fff;
        font-size: 12px;
    }

    .btn-demand-inq.large{
        width: 90%;
        margin: 20px auto 50px;
    }
    .btn-demand-inq.medium{
        font-size:16px;
        width: 80%;
        margin: 20px auto 20px;
        display: block;
    }
    #mainForm-wrap{
        width: 90%;
        margin: 0 auto;
    }
}
@media only screen and (max-width:320px){
    #top-wrap #top-text{
        background: rgba(51, 51, 51, 0.9);
        max-width: 320px;
        height: 120px;
        color:#fff;
        position: absolute;
        top:300px;
        right: 0;
        left: 0;
        margin: 0 auto;
    }
}


/*	form
------------------------------------------------------------ */
#form-wrap{
    max-width: 980px;
    width: 100%;
    margin: 0 auto 102px;
}

p.memo {
text-align:left;
margin:20px 10px;
}

.box-wrap .box01-memo {
    padding: 40px 0 2%;
    text-align: left;
    background-color: #eeeeee;
}
p.caption {
    margin-bottom: 5px;
    text-align: center;
}
@media screen and (max-width: 896px) { 
.caption img {
  width: 100%;
}
