@charset "UTF-8";
/* CSS Document */
main{width:100%;margin: 0 auto;}

@media screen and (min-width:1051px) {
    header{width: 100%; height: 100vh;position: relative;background: linear-gradient(0deg,#f7f8f8 0%,#f7f8f8 40%,#FFF 40%,#FFF 100%);}
    
    header #title{position:absolute;top:0;right: 50%; width: 450px;height: 240px;background: #13ae67;z-index: 3}
    header #title section{position:relative;width: 100%;height:100%; }
    header #title section a{position: absolute;top: 0;left: 0;display: block;width: 100%;height:100%; z-index: 3}
    header #title section #name01{position: absolute;top:30%;left:12%;padding: 0; margin:0;color: white;font-size:16px;letter-spacing:2px;line-height: 22px;}
    header #title section h1{position: absolute;top:52%;left:12%;padding: 0; margin:0;color: white;font-size: 30px;letter-spacing: 3px;font-weight: normal}
    header #title section #name02{position: absolute;top:70%;left:12%;padding: 0; margin:0;color: white;font-size: 25px;letter-spacing: 3px;}
    header #title section:hover{opacity: 0.3}
    
    header nav{position:absolute;top:0;left: 50%; width: 407px;background:white;z-index: 3}
    header nav #menu{width:100%;padding-top: 100px;padding-left: 40px}
    header nav #menu ul{width:100%;margin: 0;padding: 0;list-style: none;}
    header nav #menu ul li{position: relative;width: 198px;height: 70px; margin: 0;padding: 0;border: 1px solid #13ae67;float: left;}
    header nav #menu ul li:nth-child(3){margin:0 0 0 5px;}
    header nav #menu ul li a{position: absolute;top: 0;left: 0;display: block;width: 100%;height:100%; z-index: 3}
    header nav #menu ul li div{position: absolute;top: 16%;left:15%; font-size: 18px;color: #13ae67;letter-spacing: 2px;}
    header nav #menu ul li div::after{content: '';display: inline-block;width:8px;height: 7px;margin:0 0 3px 10px; background: url(../img/icon01.png) no-repeat;background-repeat: 100% 0%; background-size:8px auto;}
    header nav #menu ul li p{position: absolute;top:34%;left: 15%;font-size: 14px;color: #727171;letter-spacing: 1px;}
    header nav #menu ul li:hover{background:#e8efe8;}
    
    header nav #menu ul #top{display: none}
    header nav #menu ul #pp{display: none}
    .button {display: none}
    
    /*スライド*/
    header #image{position:absolute;top:0px;left: 0;width:100%;height:100%;}
    header #image section{position: relative;width:78%;min-width: 1000px; max-width: 1800px; height:100%;margin: 0 auto;}
    header #image section #slide{position:absolute;top:00px;left: 0;width:100%;height:95vh;/*height:100%;*/margin: 0;/*z-index:1*/}
    
    .swiper-container{/*position: absolute;top:0;left: 0;*/width: 100%;height:100%;/*height:100vh;*/ margin:0px auto 0 auto;padding:0px 0 0 0;/* z-index:-1*/}
    .swiper-slide-active .slide-img,
    .swiper-slide-duplicate-active .slide-img,
    .swiper-slide-prev .slide-img{ animation: zoomUp 10s linear 0s 1 normal both; }
    .slide-img{width:100%;margin-top: 200px;}
    
    #image01{height: 100%;background: url("../img/slide01.jpg") no-repeat;background-position: 50% 50%;background-size:cover}
    #image02{height: 100%;background: url("../img/slide02.jpg") no-repeat;background-position: 50% 50%;background-size:cover}
    #image03{height: 100%;background: url("../img/slide03.jpg") no-repeat;background-position: 50% 50%;background-size:cover}
    
    header #image section #message{position: absolute;bottom:15%;right: 0px;width: 60%; margin: 0;z-index: 3;}
    header #image section #message p{padding:0;margin: 0;font-size: 40px;letter-spacing: 2px;color: white;text-shadow:0px 1px 5px rgba(125,121,71,0.8);}
    
    main #profile{position: relative;width: 100%;height:890px;margin: 0 auto 50px auto;}
    main #profile #block01{position:absolute;top: 80px;left: 0;width: 95%;height: 600px;background: #f7f8f8}
    main #profile #block02{position:absolute;bottom: 0;left: 0;width: 100%;height: 400px;}
    main #profile #block02 div{width: 1000px;height:100%;margin: 0 auto;background: #51c886}
    main #profile #block03{position:absolute;top: 0;left: 0;width: 100%;}
    main #profile #block03 .inner{position:relative;width: 900px;height:100%;margin: 0 auto;}
    main #profile #block03 .inner h2{position:absolute;top: 50px;right: 0;margin: 0;padding: 0;color: #e8efe8;font-size: 110px;line-height:110px; letter-spacing: 1px;text-align: right;font-weight: normal;}
    main #profile #block03 .inner h3{position:absolute;top: 180px;left:37%;margin: 0;padding: 0;color: #13ae67;font-size:24px;letter-spacing: 1px;font-weight: normal;}
    main #profile #block03 .inner figure{position:absolute;top:180px;left: 0;width: 280px; margin: 0;padding: 0;}
    main #profile #block03 .inner figure img{width:100%; height:344px;  object-fit: cover;}
    main #profile #block03 .inner > p{position:absolute;top:300px;left:37%;width:60%;margin: 0;padding: 0;font-size:16px;letter-spacing: 2px;}
    main #profile #block03 .inner h4{position:absolute;top: 350px;left:37%;margin: 0;padding: 0;font-size:28px;letter-spacing: 5px;font-weight: normal;}
    main #profile #block03 .inner section{position:absolute;top:430px;left:37%;width:60%;margin: 0;padding: 0;}
    main #profile #block03 .inner section div{position: relative;padding-left: 30px;}
    main #profile #block03 .inner section div::before{content: ''; position: absolute;left:0%;top:0px;display: inline-block;width: 1px;height:200px;background: #13ae67;}
    main #profile #block03 .inner section div h5{margin: 0 auto 10px auto;padding: 0;font-size:20px;letter-spacing: 3px;font-weight: normal;}
    main #profile #block03 .inner section div p{margin: 0;padding: 0;font-size:15px;letter-spacing: 2px;line-height: 25px;}
    
    main #service{position: relative;width: 100%;height:1560px;margin: 0 auto 50px auto;}
    main #service #block01{position:absolute;top:60px;left:5%;width:90%; height:1500px;background: #f7f8f8}
    main #service #block02{position:absolute;top: 0;left: 0;width: 100%;}
    main #service #block02 .inner{width: 900px;height:100%;margin: 0 auto;}
    main #service #block02 .inner h2{margin: 0 0 20px 0;padding: 0;color: #e8efe8;font-size: 110px;line-height:110px; letter-spacing: 1px;font-weight: normal;}
    main #service #block02 .inner > div{width:100%;}
    main #service #block02 .inner div #text01{margin: 0; padding: 0; text-align: center;font-size: 24px;letter-spacing: 2px;color: #13ae67}
    main #service #block02 .inner div h3{margin: 0 auto 20px auto; padding: 0; text-align: center;font-size:36px;letter-spacing: 3px;color: #13ae67;font-weight: normal}
    main #service #block02 .inner div #text02{width: 90%; margin: 0 auto 30px auto; padding: 0; font-size:16px;letter-spacing: 2px;line-height:30px;}
    main #service #block02 .inner div section{width:900px; margin: 10px auto 0px auto;background: white;padding: 20px 0px 10px 0}
    main #service #block02 .inner div section figure{float: left;width:320px; }
    main #service #block02 .inner div section figure img{width: 100%;  height:200px;  object-fit: cover;}
    main #service #block02 .inner div section div{float: right;width:465px;padding:20px 30px 0 0;}
    main #service #block02 .inner div section div h4{margin: 0 auto 15px auto; padding: 0; font-size:24px;letter-spacing: 2px;color: #a48b78;font-weight: normal}
    main #service #block02 .inner div section div p{margin: 0;padding: 0;font-size:14px;letter-spacing: 2px;line-height: 24px;}
    
    main #access{position: relative;width: 100%;height:2575px;margin: 0 auto 50px auto;}
    main #access #block01{position:absolute;top:80px;right:0%;width:62%;height:2475px;background: #f7f8f8}
    main #access #block02{position:absolute;top: 0;left: 0;width: 100%;}
    main #access #block02 .inner{width: 900px;margin: 0 auto;}
    main #access #block02 .inner h2{margin: 0 auto 30px auto;padding: 0;color: #e8efe8;font-size: 110px;line-height:110px; letter-spacing: 1px;text-align: right;font-weight: normal;}
    main #access #block02 .inner h3{width: 100%;margin: 0 auto 50px auto;padding: 0;color: #13ae67;font-size:36px;line-height:36px; letter-spacing:3px;text-align:center;font-weight: normal;}
    main #access #block02 .inner section{position: relative;width: 100%;height:490px;margin: 0 auto 80px auto}
    main #access #block02 .inner section figure{position:absolute;top: 0;left: 0;width:445px;height: 300px;margin: 0 auto;padding: 0;z-index: 1}
    main #access #block02 .inner section figure img{width:100%; height:300px; margin: 0 auto;padding: 0; object-fit: cover;object-position: 50% 0%;}
    main #access #block02 .inner section .map{position:absolute;top: 0;right: 0;width:445px; z-index: 1}
    main #access #block02 .inner section .map div{position: relative;padding-bottom:300px;height: 0;overflow: hidden;}
    main #access #block02 .inner section .map div iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;border:0}
    main #access #block02 .inner section .office{position:absolute;bottom: 0;left:10%;width:80%;background: #51c886;padding: 80px 0 30px 0;}
    main #access #block02 .inner section .office h4{width:80%;margin: 0 auto 15px auto;padding:0px 0 5px 0; color: white;font-size: 24px;letter-spacing:1px;font-weight: normal;border-bottom: 1px solid white}
    main #access #block02 .inner section .office ul{list-style: none;width:80%;margin: 0 auto;padding: 0;}
    main #access #block02 .inner section .office ul li{margin: 0;padding: 0 30px 0 0;float: left;color: white;font-size: 14px;line-height:24px; letter-spacing:2px;}
    main #access #block02 .inner section .office ul li:last-child{padding: 0;}
}

@media screen and (max-width:1050px) {
    header{width: 100%; height: 100vh;position: relative; background: linear-gradient(0deg,#f7f8f8 0%,#f7f8f8 40%,#FFF 40%,#FFF 100%);}
    
    header #title{position: fixed;top:0%;left:0%;width:100%;height:80px; background: #13ae67;z-index:3}
    header #title section{position:relative;width: 100%;height:100%;margin: 0 auto}
    header #title section a{position: absolute;top: 0;left: 0;display: block;width: 100%;height:100%; z-index: 3}
    header #title section #name01{position: absolute;top:14%;left:20px;width:100%;padding: 0; margin:0;color: white;font-size:11px;letter-spacing:0px;line-height:14px;}
    header #title section h1{position: absolute;top:32%;left:20px; padding: 0; margin:0;color: white;font-size:20px;letter-spacing:0px;font-weight: normal}
    header #title section #name02{position: absolute;top:62%;left:20px;padding: 0; margin:0;color: white;font-size:15px;letter-spacing:0px;}
    
    .button{display:block;position: fixed;	right:0%;top:0px;width: 80px;height:80px;padding:0px 0 0 0px;margin: 0 0;text-align: center;letter-spacing: 1px; font-size:14px;color: white;/*background:#13ae67;*/ cursor:pointer;z-index: 3} 
    .button span {display:block;position: absolute;	height:3px;border-radius: 2px;	width:66%;	background:white;right:17%;	-webkit-transition: .35s ease-in-out;	-moz-transition: .35s ease-in-out;	transition: .35s ease-in-out;}
    .button span:nth-child(1) {	top:35%;}
    .button span:nth-child(2) {	top:50%;}
    .button span:nth-child(3) {	top:65%;}    
    
    .open .button span{display:block;}
    .open .button span:nth-child(1) {	top: 50%;	-webkit-transform: rotate(45deg);	-moz-transform: rotate(45deg);	transform: rotate(45deg); background:white}
    .open .button span:nth-child(2) {	width: 0;	left: 50%;}
    .open .button span:nth-child(3) {	top:50%;	-webkit-transform: rotate(-45deg);	-moz-transform: rotate(-45deg);	transform: rotate(-45deg); background:white}
    .open nav{	display: block;	animation-duration: 0.6s;	animation-name: fade-in;} 
        
    @keyframes fade-in { from { opacity:0.1;}        to { opacity:1;}    }
    
    header nav{display: none;	width: 100%;	height:100vh;	position:fixed;	top:80px;left: 0;background:rgba(255,255,255,0.95);z-index:9999;}
    header nav #menu{width:100%;margin:0 auto;padding:0;position: fixed;top: 100px;left:0%;height:75vh;overflow-y: scroll;	-webkit-overflow-scrolling: touch;	overflow-scrolling: touch;}
    header nav #menu ul{width:90%;margin: 0 auto;padding: 0;list-style: none;}
    header nav #menu ul li{position: relative;width:100%;height: 70px; margin: 0 0 5px 0;padding: 0;border: 1px solid #13ae67;float:inherit;}
    header nav #menu ul li:nth-child(3){margin:0 0 5px 0px;}
    header nav #menu ul li a{position: absolute;top: 0;left: 0;display: block;width: 100%;height:100%; z-index: 3}
    header nav #menu ul li div{position: absolute;top: 16%;left:5%; font-size: 16px;color: #13ae67;letter-spacing: 1px;}
    header nav #menu ul li div::after{content: '';display: inline-block;width:8px;height: 7px;margin:0 0 3px 10px; background: url(../img/icon01.png) no-repeat;background-repeat: 100% 0%; background-size:8px auto;}
    header nav #menu ul li p{position: absolute;top:34%;left:5%;font-size: 14px;color: #727171;letter-spacing: 1px;}
    header nav #menu ul li:hover{background:#e8efe8;}
    
    /*スライド*/
    header #image{position:absolute;top:0px;left: 0;width:100%;height:100%;}
    header #image section{position: relative;width:95%;min-width:inherit; max-width:inherit; height:100%;margin: 0 auto;}
    header #image section #slide{position:absolute;top:00px;left: 0;width:100%;height:85vh;/*height:100%;*/margin: 0;z-index:0}
    
    .swiper-container{/*position: absolute;top:0;left: 0;*/width: 100%;height:100%;/*height:100vh;*/ margin:0px auto 0 auto;padding:0px 0 0 0;/* z-index:-1*/}
    .swiper-slide-active .slide-img,
    .swiper-slide-duplicate-active .slide-img,
    .swiper-slide-prev .slide-img{ animation: zoomUp 10s linear 0s 1 normal both; }
    .slide-img{width:100%;margin-top:90px;}
    #image01{height: 100%;background: url("../img/slide01.jpg") no-repeat;background-position: 50% 50%;background-size:cover}
    #image02{height: 100%;background: url("../img/slide02.jpg") no-repeat;background-position: 50% 50%;background-size:cover}
    #image03{height: 100%;background: url("../img/slide03.jpg") no-repeat;background-position: 50% 50%;background-size:cover}
    
    header #image section #message{position: absolute;bottom:45%;right: 1%;width:98%; margin: 0;text-align: center; z-index:0;}
    header #image section #message p{padding:0;margin: 0;font-size:22px;letter-spacing:0px;color: white;text-shadow:0px 1px 5px rgba(125,121,71,0.8);}
    
    main #profile{/*position: relative;*/width: 100%;height:auto;margin: 0 auto 30px auto;}
    main #profile #block01{display: none;}
    main #profile #block02{display: none;}
    main #profile #block03{width: 100%;margin: 0 auto;}
    main #profile #block03 .inner{width:80%;max-width:500px; height:100%;margin: 0 auto;}
    main #profile #block03 .inner h2{margin: 0;padding:20px 0 10px 0;color: #e8efe8;font-size:60px;line-height:60px; letter-spacing: 1px;text-align: right;font-weight: normal;}
    main #profile #block03 .inner h3{margin: 0;padding: 0;color: #13ae67;font-size:18px;letter-spacing: 0px;text-align: center;}
    main #profile #block03 .inner figure{width:100%;max-width:300px; margin: 0 auto 10px auto;padding: 0;}
    main #profile #block03 .inner figure img{width:100%; height:240px;  object-fit: cover;}
    main #profile #block03 .inner > p{width:100%;margin: 0;padding: 0;font-size:14px;letter-spacing: 0px;}
    main #profile #block03 .inner h4{margin: 0 auto 20px auto;padding: 0;font-size:20px;letter-spacing: 1px;font-weight: normal;}
    main #profile #block03 .inner section{width:100%;margin: 0 auto;padding: 0;}
    main #profile #block03 .inner section div{position: relative;padding-left:20px;}
    main #profile #block03 .inner section div::before{content: ''; position: absolute;left:0%;top:0px;display: inline-block;width: 1px;height:100%;background: #13ae67;}
    main #profile #block03 .inner section div h5{margin: 0 auto 10px auto;padding: 0;font-size:18px;letter-spacing:1px;font-weight: normal;}
    main #profile #block03 .inner section div p{margin: 0;padding: 0;font-size:13px;letter-spacing:0px;line-height:18px;}
    
    main #service{width: 100%;margin: 0 auto 30px auto;padding:20px 0;background: #f7f8f8}
    main #service #block01{display: block}
    main #service #block02{width: 100%;margin: 0 auto;}
    main #service #block02 .inner{width:80%;margin: 0 auto;}
    main #service #block02 .inner h2{margin: 0 0 0px 0;padding:0px 0 0 0;color: #e8efe8;font-size: 60px;line-height:60px; letter-spacing: 1px;font-weight: normal;}
    main #service #block02 .inner > div{width:100%;}
    main #service #block02 .inner div #text01{margin: 0; padding: 0; text-align: center;font-size: 16px;letter-spacing: 0px;color: #13ae67}
    main #service #block02 .inner div h3{margin: 0 auto 10px auto; padding: 0; text-align: center;font-size:22px;letter-spacing:1px;color: #13ae67;}
    main #service #block02 .inner div #text02{width:100%; margin: 0 auto 20px auto; padding: 0; font-size:14px;letter-spacing:0px;line-height:22px;}
    main #service #block02 .inner div section{width:100%; margin:20px auto 0px auto;background: white;padding:0px 0px 20px 0}
    main #service #block02 .inner div section figure{width:100%;margin: 0;padding: 0 }
    main #service #block02 .inner div section figure img{width: 100%;  height:150px;  object-fit: cover;}
    main #service #block02 .inner div section div{width:90%;margin: 0 auto;padding:15px 0px 0 0;}
    main #service #block02 .inner div section div h4{margin: 0 auto 10px auto; padding: 0; font-size:18px;letter-spacing: 1px;color: #a48b78;}
    main #service #block02 .inner div section div p{margin: 0;padding: 0;font-size:14px;letter-spacing: 0px;line-height:22px;}
    
    main #access{width: 100%;margin: 0 auto 50px auto;}
    main #access #block01{display: none}
    main #access #block02{width: 100%; margin: 0 auto}
    main #access #block02 .inner{width:80%;margin: 0 auto;}
    main #access #block02 .inner h2{margin: 0 auto 10px auto;padding: 0;color: #e8efe8;font-size:45px;line-height:45px; letter-spacing:0px;text-align: right;font-weight: normal;}
    main #access #block02 .inner h3{margin: 0 auto 20px auto;padding: 0;color: #13ae67;font-size:22px;letter-spacing:1px;text-align:center;}
    main #access #block02 .inner section{width: 100%;margin: 0 auto 20px auto;padding:15px 0 10px 0;border-top: 1px solid #51c886;}
    main #access #block02 .inner section figure{width:100%;margin: 0 auto;padding: 0;}
    main #access #block02 .inner section figure img{width:100%; height:180px; margin: 0 auto;padding: 0; object-fit: cover;object-position: 50% 0%;}
    main #access #block02 .inner section .map{width:100%;margin: 0 auto}
    main #access #block02 .inner section .map div{position: relative;padding-bottom:240px;height: 0;overflow: hidden;}
    main #access #block02 .inner section .map div iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;border:0}
    main #access #block02 .inner section .office{width:100%;margin: 0 auto;padding: 0px 0 10px 0;}
    main #access #block02 .inner section .office h4{width:100%;margin: 0 auto 10px auto;padding:0px ; color: #13ae67;font-size: 20px;letter-spacing:1px;}
    main #access #block02 .inner section .office ul{list-style: none;width:100%;margin: 0 auto;padding: 0;}
    main #access #block02 .inner section .office ul li{margin: 0;padding: 0 0px 10px 0;font-size: 14px;line-height:22px; letter-spacing:0px;}
    
}