@charset "UTF-8";
/* CSS Document */

.sub section#subContainer section.main_v{
    width:100%;
    background: #5aaec1;
}

.sub section#subContainer section.main_v dt{
    width:100%;
    padding-top:50px;
    text-align:center;
   	background:linear-gradient(180deg, rgba(255,255,255,0.0) 0%, rgba(255,255,255,0.0) 85%,rgb(90, 173, 193) 85%, rgb(90, 173, 193) 100%),
				url("../img/open_main_v_img.jpg")repeat top center;
	background-size: contain;

}


.sub section#subContainer section.main_v dt img{
    width:100%;
    max-width:870px;
}
.sub section#subContainer section.main_v dd{
    color:#fff;
    width:90%;
    max-width:800px;
    margin:0 auto;
    padding:0;
}
.sub section#subContainer section.main_v dd h4{
    font-size:23px;
    font-weight:bold;
    text-align:center;
    line-height:2em;
    margin:1em 0;
    padding:0 0 1em 0;
    border-bottom:1px solid #fff;
}

.sub section#subContainer section.main_v dd h4 strong{
    color:#fff;
    font-size:130%;
    font-weight:bold;
}

.sub section#subContainer section.main_v .marquee{
    height:150px;
    width:100%;
    background:url("../img/open_main_v_minihouse_bg.png") repeat bottom;
    background-size: auto 100%;
    animation: bgiLoop 30s linear infinite;
    position:relative;
}

@keyframes bgiLoop {
    0% { background-position: 100% 0;}
  100% { background-position: 0 0;}
}


.sub section#subContainer section.main_v .marquee img{
    width:100%;
    height:auto;
    max-width:900px;
    margin:0 auto;
    display:block;
    position:absolute;
    left:0;
    right:0;
    bottom:1px;
}

.sub section#subContainer .sec01 {
    width:100%;
    margin:0;
    padding:100px 0 0 0;
    background-image: linear-gradient(#f2f2f2 1px, transparent 0),
                    linear-gradient(90deg, #f2f2f2 1px, transparent 0);
  background-size: 30px 30px;
}


.sub section#subContainer .sec01 .title{
    width:96%;
    max-width:1200px;
    margin:0 auto;
    display:block;
}

.sub section#subContainer .sec01 .title dl{
    width:100%;
    max-width:750px;
}


.sub section#subContainer .sec01 .title dl h3{
    font-size:180%;
    font-weight:bold;
    letter-spacing:0;
    text-align:left;
    margin-bottom:0.5em;
    border-bottom:1px solid #666;
}

.sub section#subContainer .sec01 .title dl h3 span{
    font-size:130%;
}

.sub section#subContainer .sec01 .title dl h3 span strong{
    color:#5aaec1;
    font-size:130%;
    font-weight:bold;
    -webkit-text-stroke: 1px #000;
    text-stroke: 1px #000;
    line-height:1em;
}

.sub section#subContainer .sec01 .title dl h3 span strong em{
    font-size:140%;
    display:inline-block;
    transform: rotate(20deg);
    line-height:0;
    vertical-align:-0.1em;
}

.sub section#subContainer .sec01 ul{
    width:96%;
    max-width:1200px;
    margin:-50px auto 0 auto;
    padding-bottom:100px;
}

.sub section#subContainer .sec01 ul li{
    width:100%;
    height:450px;
    margin:0 auto 100px auto;
    position:relative;
}

.sub section#subContainer .sec01 ul li dd{
    width:35%;
    position:absolute;
    bottom:0;
    margin:auto;
}


.sub section#subContainer .sec01 ul li:nth-child(1){
    background-image :url(../img/open_sec01_img_a_01.jpg) , url(../img/open_sec01_img_a_02.jpg), url(../img/open_sec01_img_a_03.jpg);
    background-size: 25% auto, 20% auto , 30% auto;
    background-position: bottom  right 25%, bottom right 50% ,bottom right;
    background-repeat: no-repeat, no-repeat;
}


.sub section#subContainer .sec01 ul li:nth-child(2){
    background-image :url(../img/open_sec01_img_b_01.jpg) , url(../img/open_sec01_img_b_02.jpg), url(../img/open_sec01_img_b_03.jpg);
    background-size: 25% auto, 20% auto , 30% auto;
    background-position: bottom  left 25%, bottom left 50% ,bottom left;
    background-repeat: no-repeat, no-repeat;
}

.sub section#subContainer .sec01 ul li:nth-child(2) dd{
    right:0;
}

.sub section#subContainer .sec01 ul li:nth-child(3){
    background-image :url(../img/open_sec01_img_c_01.jpg) , url(../img/open_sec01_img_c_02.jpg), url(../img/open_sec01_img_c_03.jpg);
    background-size: 25% auto, 20% auto , 30% auto;
    background-position: bottom right 25%, bottom right 50% ,bottom right;
    background-repeat: no-repeat, no-repeat;
}



.sub section#subContainer .sec01 ul li dd h5{
    height:9em;
    position:relative;
}
.sub section#subContainer .sec01 ul li dd h5 strong{
    font-size:160%;
    font-weight:bold;
    line-height:unset;
    position:absolute;
    bottom:0.5em;
    border-bottom:1px solid #666;
}
.sub section#subContainer .sec01 ul li dd h5 span{
    font-size:70%;
    line-height:2em;
    display:block;
}

.sub section#subContainer .sec01 ul li:nth-child(1) dd h5{
   background:url("../img/open_sec01_title_01.png") no-repeat right;
   background-size: contain;
}

.sub section#subContainer .sec01 ul li:nth-child(2) dd h5{
   background:url("../img/open_sec01_title_02.png") no-repeat right;
   background-size: contain;
}

.sub section#subContainer .sec01 ul li:nth-child(3) dd h5{
   background:url("../img/open_sec01_title_03.png") no-repeat right;
   background-size: contain;
}

.sub section#subContainer .sec01 ul li dt{
    height:300px;
    overflow:hidden;
}

.sub section#subContainer .sec01 ul li dt img{
    height:100%;
    object-fit:cover;
}

.sub section#subContainer .sec02 {
    height:600px;
    background:url("../img/open_sec03_info_01.jpg") repeat top center;
    background-size: contain;
    margin-bottom:100px;
}

.sub section#subContainer .sec02 ul{
    max-width:1200px;
    height:100%;
    margin:auto;
    position:relative;
}

.sub section#subContainer .sec02 ul dl{
    width:700px;
    height:80%;
    padding:50px;
    border:10px solid #5aaec1;
    background:#fff;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    box-sizing:border-box;
    filter: drop-shadow(0 0 5px rgba(0,0,0,0.6));
}

.sub section#subContainer .sec02 ul dl h5{
    color:#000;
    font-size:170%;
    font-weight:bold;
    margin-bottom:0.8em;
    text-align:center;
}

.sub section#subContainer .sec02 ul dl h5 span{
   color:#5aaec1;
    font-size:200%;
    line-height:1em;
    display:block;
    -webkit-text-stroke: 1px #999;
    text-stroke: 1px #999;
    border-bottom:1px solid #666;
    padding-bottom:10px;
    font-feature-settings: "palt";
}

.sub section#subContainer .sec02 ul dl h5 span em{
    font-size:130%;
    line-height:1em;
    display:inline-block;
     transform: rotate(20deg);
}
.sub section#subContainer .sec03{
	margin-bottom: 100px;
}
.sub section#subContainer .sec03 a{
	color: #fff;
    width: 700px;
    padding: 50px;
    background: #5aaec1;
    font-size: 150%;
    display: block;
    margin: 0 auto;
	box-sizing: border-box;
	text-align: center;
}
.sub section#subContainer .sec03 a:hover{
	text-decoration: none;
	opacity:0.7;
}
.sub section#subContainer #embedForm{
	display: none;
}
.sub section#subContainer .dummyform{
    max-width:1200px;
    margin:auto;
}

.sub section#subContainer .dummyform img{
    width:100%;
}


@media screen and (max-width: 769px){
    .sub section#subContainer section.main_v dt{
        background-size: contain;
    }
    .sub section#subContainer section.main_v dt img{
        width:100%;
    }
    .sub section#subContainer section.main_v dd h4{
        font-size:130%;
        line-height:1.5em;
        margin:0 0 0.5em 0;
        padding:0 0 0.5em 0;
    }
    .sub section#subContainer section.main_v dd h4 strong::after{
       	content: "\A" ;
	   white-space: pre ;
    }

    .sub section#subContainer section.main_v .marquee{
        height:100px;
        width:150%;
    }

    .sub section#subContainer section.main_v .marquee img{
        width:67%;
        max-width:unset;
        right:unset;
        left:unset;
    }



    .sub section#subContainer .sec01 .title dl{
        width:100%;
    }


    .sub section#subContainer .sec01 .title dl h3{
        font-size:200%;
        font-weight:bold;
        text-align:center;
    }
    .sub section#subContainer .sec01 ul li{
        width:100%;
        height:35vh;
        min-height:300px;
        margin-bottom:0vh;
    }
    .sub section#subContainer .sec01 ul li:nth-child(1){
        background-size: 20% auto, 15% auto , 25% auto;
        background-position: bottom  right 20%, bottom right 40% ,bottom right;
    }


    .sub section#subContainer .sec01 ul li:nth-child(2){
        background-size: 20% auto, 15% auto , 25% auto;
        background-position: bottom  left 20%, bottom left 40% ,bottom left;
    }

    .sub section#subContainer .sec01 ul li:nth-child(3){
        background-size: 20% auto, 15% auto , 25% auto;
        background-position: bottom right 20%, bottom right 40% ,bottom right;
    }


    .sub section#subContainer .sec01 ul li dd{
        width:50%;
    }


    .sub section#subContainer .sec01 {
        width:100%;
        padding:50px 0 0 0;
        }

    .sub section#subContainer .sec01 ul li dd h5{
        height:7em;
        position:relative;
    }
    .sub section#subContainer .sec01 ul li dd h5 strong{
    }
    .sub section#subContainer .sec01 ul li dd h5 span{
    }

    .sub section#subContainer .sec01 ul{
        margin:50px auto 0 auto;
    }
    .sub section#subContainer .sec02 ul dl h5 span{
        -webkit-text-stroke: 1px #999;
        text-stroke: 1px #999;
        border-bottom:1px solid #666;
    }

    .sub section#subContainer .sec01 ul li dt{
        height:20vh;
    }
    .sub section#subContainer .sec01 ul li dt img{
        width:100%;
    }

    .sub section#subContainer .sec02 {
        height:auto;
        padding:15% 3%;
        margin-bottom:100px;
        box-sizing:border-box;
    }

    .sub section#subContainer .sec02 ul{
       padding:unset;
       position:unset;
    }

    .sub section#subContainer .sec02 ul dl{
        width:90%;
        height:90%;
        padding:5%;
        background:#fff;
        position:unset;
        top:unset;
        bottom:unset;
        left:unset;
        right:unset;
        margin:auto;
        box-sizing:border-box;
        filter: drop-shadow(0 0 5px rgba(0,0,0,0.6));
        box-sizing:border-box;
    }
}


@media screen and (max-width: 500px){

    .sub section#subContainer section.main_v dt{
         padding-top:5vh;
    }
    .sub section#subContainer section.main_v dt img{
        width:100%;
    }
    .sub section#subContainer section.main_v dd{
        width:90%;
        max-width:unset;
        margin:0 auto;
        padding:0;
    }


    .sub section#subContainer section.main_v marquee{
        height:70px;
    }

    .sub section#subContainer section.main_v marquee img{
        height:70px;
    }
    .sub section#subContainer .sec01 .title dl h3{
        font-size:150%;
        padding-bottom:0.7em;
    }
    .sub section#subContainer .sec01 .title dl h3 span{
        display:block;
    }

    .sub section#subContainer .sec01 .title dl h3 span strong{
        font-size:180%;
    }

    .sub section#subContainer .sec01 ul{
        margin:5vh auto 0 auto;
        padding-bottom:5vh;

    }
     .sub section#subContainer .sec01 ul li{
        width:100%;
        height:35vh;
        min-height:400px;
        margin-bottom:10vh;
    }

    .sub section#subContainer .sec01 ul li:nth-child(1){
        background-size: 30% auto, 30% auto , 30% auto;
        background-position: bottom  center, bottom left,bottom right;
    }
    .sub section#subContainer .sec01 ul li:nth-child(2){
        background-size: 30% auto, 30% auto , 30% auto;
        background-position: bottom  center, bottom right,bottom left;
    }

    .sub section#subContainer .sec01 ul li:nth-child(3){
        background-size: 30% auto, 30% auto , 30% auto;
        background-position: bottom center, bottom left,bottom right;
    }



    .sub section#subContainer .sec01 ul li dd{
        width:100%;
        position:unset;
    }


     .sub section#subContainer .sec02 {
        padding:10% 2%;
    }
    .sub section#subContainer .sec02 ul dl{
        width:96%;
        height:90%;
        padding:3%;
    }
    .sub section#subContainer .sec02 ul dl h5{
        color:#000;
        font-size:130%;
        font-weight:bold;
        margin-bottom:0.8em;
        text-align:center;
    }

    .sub section#subContainer .sec02 ul dl h5 span{
        font-size:160%;
    }
    .sub section#subContainer .sec02 {
        height:auto;
        padding:20% 3%;
        margin-bottom:20px;
        box-sizing:border-box;
    }


}