@charset "utf-8";



/* main */

main {margin:8% auto 0;}
main h2 {
    width:80%;
    margin:0 auto;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
}
main h2 img {max-width:100%;}

@media only screen and (max-width:640px){
main {margin:90px auto 0;}
main h2 {width:100%;}
}

/* section */

section{text-align: center; width: 63%; margin: 0 auto;}
section h3{font-size: 2rem; color: #65989b;}
section p{font-size: 1rem; text-align: center;}
section p b{font-size: 1.5rem; color: #65989b;}

@media only screen and (max-width:640px){
section{width: 90%;}
section h3{font-size: 1.5rem; line-height:1.5; margin-bottom:10px;}
section p{font-size: 0.8rem; line-height: 1.7;}
section p b{font-size: 1.2rem;}
}

/* concept */
.concept{margin-top: 30px;}


/* plan */
.plan{margin-top: 80px;}
.plan_text{display: flex; margin-top:15px; justify-content: center;}
.plan_text img{width: 50%; margin-bottom: 30px;}
.plan_text p.right{margin: 130px 0 0 100px;}
.plan_text p.left{margin: 100px 100px 0 0;}

@media only screen and (max-width:640px){
.plan{margin-top: 50px;}
.plan_text{display: block;}
.plan_text img{width: 100%; margin-bottom: 10px; }
.plan_text p.right{margin: 0;}
.plan_text p.left{margin: 0;}
.box1{display: flex; flex-flow: row wrap; justify-content: center; align-content: center;}
.box1 p{ order: 2;}
.box1 img{order: 1;}
}

/* point */
.point{margin-top: 80px;}
.point h3{width:100%; line-height: 1; margin-bottom: 50px;}
.point h3 span{font-size: 3rem;}
.point .namber{
	width:96%;
	max-width:520px;
	margin: 0 auto 30px;
	padding:0 0 0 30px;
	display:flex;
}
.point .namber p b{line-height: 1.2;}
.point .namber h1{font-size: 5rem; margin: -60px 20px 0 0; 
    color: transparent; -webkit-text-stroke: 2px #65989b;}
.point .namber h1.namber_second{margin-top:-50px;}
.point a {
  border-radius: 7px;
  background: #65989b;
  color: #fff;
  padding: 15px 20px;
}
.point a:hover {
  color: #fff;
  background: #487C7F;
}



@media only screen and (max-width:640px){
.point{margin-top: 50px;}
.point h3{line-height: 1; margin-bottom: 30px;}
.point h3 span{font-size: 2.5rem;}
.point .namber{display: flex; margin-bottom:30px; padding:0 0 0 10px;}
.point .namber h1{font-size:3.4rem; margin: -40px 10px 0 0; 
    color: transparent; -webkit-text-stroke: 2px #65989b;}
.point .namber h1.namber_second{margin-top:-30px;}
.point .namber h1.namber_third{margin-top:-40px;}
.point a{font-size: 0.8rem;  padding: 10px 20px;}

}

/* scene */
.scene{margin-top: 80px;}
.scene_img{
    width: 80%; 
    margin: 30px auto 0;
}
.slick-dots li:hover button, .slick-dots li.slick-active button {
    background: none;}

@media only screen and (max-width:640px){
.scene{margin-top: 50px;}
.scene_img{
    width: 100%; 
    margin: 10px auto 0;
}
}


/* voice */
.voice_comment{display: flex; justify-content: center; align-content: center; align-items: center; margin: 20px auto 0;}
.voice_comment img{width: 5%;}
.voice_comment p{margin-top: 30px; width: 40%;}
.voice{margin-top: 90px;}

@media only screen and (max-width:640px){
.voice_comment{margin:0;}
.voice_comment img{width: 10%; margin: 5px 10px 0 0;}
.voice_comment p{margin-top: 30px; width: 70%;}
.voice{margin-top: 60px;}
}

/* itiran */
.itiran{margin-top: 80px;}
.itiran .itiran_coment{display: flex; flex-wrap: wrap; justify-content: center;}
.itiran .box {
    position: relative;
    padding: 1.3em 0.7em;
    margin: 15px 20px;
    background: #e6f4ff;
    font-weight: bold;
    width: 40%;
    border-radius: 15px;
}
.box:after {
    position: absolute;
    content: '';
    top: 100%;
    left: 30px;
    border: 15px solid transparent;
    border-top: 15px solid #e6f4ff;
    width: 0;
    height: 0;
}
.box p {
    margin: 0; 
    padding: 0;
}
.itiran p.sonota{margin-top: 40px;}

@media only screen and (max-width:640px){
.itiran{margin-top: 50px;}
.itiran_coment {display:flex; flex-flow:row wrap; justify-content:space-between !important; align-content:center; align-items:center;}
.itiran .box {
    padding: 1em 0;
    margin: 13px 0;
    width: 48%;
}
.box:after {
    border: 10px solid transparent;
    border-top: 10px solid #e6f4ff;
}
.itiran p.sonota{margin-top: 20px;}
}

/* mailform */
.mailform {
    width:100%;
    margin:80px auto;
    padding:80px 0;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center; flex-direction:column;
    background:linear-gradient(25deg, rgba(92,73,65, 0.4), rgba(92,73,65, 0.8)) ,url("../img/click-form-pc.jpg") center no-repeat;
    background-size:cover;
}
.mailform a {
    margin:10px 0 0;
    color:#fff;
    font-size:2.3rem;
    text-shadow:#372414 5px 0 10px;
    line-height: 1.5;
}

@media only screen and (max-width:640px){
.mailform {
        margin:40px auto 50px;
        padding:50px 0;
        background:linear-gradient(25deg, rgba(92,73,65, 0.4), rgba(92,73,65, 0.8)) ,url("../img/click-form-sp.jpg") center no-repeat;
        background-size:cover;
    }
.mailform h3 {font-size:1.6rem;}
.mailform p  {font-size:1rem;}
.mailform a  {font-size:2rem;}
}