@charset "UTF-8";

html{scroll-behavior: smooth;}

.sp{display:none;}

*{margin:0;padding:0;box-sizing: border-box;transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out;}
body{position:relative;}
a,p,b,li,td,th,h5,caption,dd,dt {color:black;font-size:18px;line-height:1.8em;margin:0;font-family: "Noto Sans JP", sans-serif;font-weight:400;text-align: justify;word-break:break-all;font-weight:normal;transform: rotate(0.03deg);}
a{text-decoration:none;font-size: inherit;}
span{font-size:inherit;}
ul{list-style-type:none;}
table{border-collapse:collapse;}
section{width:100%;overflow:hidden;}
article{position:relative;width:1280px;margin:0 auto;}
#logo>img{height:40px;padding-top:10px;}
#logo_g{position:fixed;left:50%;top:20px;margin:0 0 0 -600px;z-index:100;display:flex;flex-direction:row;align-items:center;}
#logo_g>img{width: 38px;margin-bottom:10px;margin-right:10px;}
#logo_g>div{display:flex;align-items: center;gap: 0 6px;}
#logo_g>div>h5,
#logo_g>div>p
{font-size:28px;font-family:"Helvetica NeueArial","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;line-height:1;
  text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF,
  -1px 1px 0 #FFF,  1px -1px 0 #FFF,
  1px 0 0 #FFF, -1px  0 0 #FFF,
  0 1px 0 #FFF,  0 -1px 0 #FFF;}
#logo_g>div>p{font-size:14px;line-height:1.2;display:block;width:2em;}
#tel{position:fixed;left:50%;top:15px;margin:0 0 0 -380px;z-index:100;display:block; height:59px; width: 187px; text-indent:-9999px;}
#tel{background:url('./images/btn_tel.png') no-repeat;}

#menu_top{position:fixed;width:100%;top:0;height:60px;z-index:100;}
#menu_top>div{width:1280px;margin:0 auto;display:flex;flex-wrap:nowrap;align-items:flex-end;justify-content:flex-end;gap:0 1em;padding:.5em 2em 1em 0;z-index:100;position:relative;}
#menu_top>div>ul{display:flex;justify-content:space-around;gap:0 30px;position:absolute;right:60px;top:10px;background-color:rgba(255,255,255,0.8);padding: 6px 20px;border-radius: 6px;}
#menu_top>div>a,
#menu_top>div>p{font-family: 'Arimo', sans-serif;font-size:16px;line-height:32px;position:relative;}0
#menu_top>div p::after{position:absolute;bottom:0;left:0;content: '';width:100%;height:2px;background-color:#000;}
#menu_top>div>a::after{position:absolute;bottom:0;left:0;content: '';width:0;height:2px;background-color:#000;transition:.3s;}
#menu_top>div>a:hover::after {width:100%;}
#menu_top>div>a.gotomail:hover::after{width:0%;}
#menu_top>div>a>img{vertical-align:bottom;}

#menu_bottom{position:absolute;width:100%;bottom:120px;left:0;height:60px;}
#menu_bottom>ul{display:flex;justify-content:space-around;width:100%;}
#menu_bottom p::after{position:absolute;bottom:0;left:0;content: '';width:100%;height:2px;background-color:#000;}
#menu_bottom a::after{position:absolute;bottom:0;left:0;content: '';width:0;height:2px;background-color:#000;transition:.3s;}
#menu_bottom a:hover::after {width:100%;}

nav{}
#hamburder{position:absolute;top:10px;right:10px;width:50px;height:50px;padding:10px 10px 40px 10px;background-color:rgba(255,255,255,0.5);border-radius:6px;}
.menu-btn {transition: all 2s;display: flex;height:30px;width:30px;justify-content: center;align-items:center;background-color: none;z-index: 998; cursor: pointer;transition: all .5s ease;}
.menu-btn::after{content:"OPEN";font-size:11px;padding-top:150%;margin-top:-150%;color:transparent;transition: all .5s ease;}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {content:'';display:block;height:3px;width:30px;border-radius:3px;background-color:#4593A0;position:absolute;transition: all .5s ease;}
.menu-btn span:before {bottom: 10px;}
.menu-btn span:after {top: 10px;}
.menu-btn:hover::after{color:#4593A0;margin-top:0;}
#menu-btn-check:checked ~ .menu-btn::after{content:"CLOSE";color:#4593A0;margin-top:0;}
#menu-btn-check:checked ~ .menu-btn span {background-color: rgba(255, 255, 255, 0);}
#menu-btn-check:checked ~ .menu-btn span::before {bottom: 0;transform: rotate(45deg);}
#menu-btn-check:checked ~ .menu-btn span::after {top: 0;transform: rotate(-45deg);}
#menu-btn-check {display:none;}
.menu-content {width: 100%;height: 100%;position: fixed;top: 0;right: 100%;z-index: 997;background-color: #E9EDF6;transition: all 0.5s;}
.menu-content>ul{padding:70px 10px 0;}
.menu-content ul>li {border-bottom: solid 1px #4593A0;list-style: none;}
.menu-content ul>li>a {display: block;width: 100%;font-size: 24px;line-height:2em;color:#4593A0;text-decoration: none;padding: 9px 15px 10px 0;position: relative;text-align:center;}
.menu-content ul>li>a::before {content: "";width: 7px;height: 7px;border-top: solid 2px #4593A0;border-right: solid 2px #4593A0;transform: rotate(45deg);position: absolute;right: 11px;top: 16px;}
#menu-btn-check:checked ~ .menu-content {right:0;}

#goto-top{display: block;width: 60px;height: 60px;box-sizing: border-box;padding-top: 30px!important;text-align: center;letter-spacing: -1px;
font-size: 85%;text-decoration: none;color: #FFF;position: fixed;
bottom: -65px;left:50%;margin-left:580px;
z-index: 10000;-webkit-transition: all 0.4s ease; cursor: pointer;}
#goto-top::before{content: "";display: block;border-top: 2px solid #FFF;border-right: 2px solid #FFF;width: 25%;height: 25%;top: 25%;left: 0;right: 0;margin: auto;position: absolute;transform: rotate(-45deg);}

.loader {position: fixed;width: 100vw;height: 100vh;top: 0px;left: 0px;background: #000;z-index: 9999;}
.loadanimation {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);color: #ffffff;}
.loadanimation,
.loadanimation:before,
.loadanimation:after {width: 1em;height: 4em;background: #ffffff;animation: load 1s infinite ease-in-out;}
.loadanimation:before,
.loadanimation:after {position: absolute;top: 0;content: '';}
.loadanimation{animation-delay: -0.16s;}
.loadanimation:before {left: -1.5em;animation-delay: -0.32s;}
.loadanimation:after {left: 1.5em;}
@keyframes load { 0%,80%,100% {box-shadow: 0 0;height: 4em;} 40% {box-shadow: 0 -2em;height: 5em;}}

.eachTextAnime span{opacity: 0;}
.eachTextAnime.appeartext span{ animation:text_anime_on 1s ease-out forwards; }
@keyframes text_anime_on {
  0% {opacity:0;}
  100% {opacity:1;}
}

h3{font-size:40px;font-family: "Sawarabi Mincho", serif;font-weight: 400;margin-bottom:.5em;}
h3::before{content:"-----";}

a.link{display:block;border:1px solid #006834;width: auto;padding: 0.2em 2em 0.5em;font-size: 18px;line-height: 2;text-align: center;margin: 60px auto;}
a.link:hover{border:1px solid #006834;;background-color:#006834;color:white;}


footer>article{}
.detail{display:flex;justify-content:space-evenly;align-items:stretch;margin-bottom:30px;}
.detail>div{width:50%;text-align:center;}
.detail iframe{width:100%;height:300px;}
.detail>div>div{width:100%;height:300px;background-color:#8ec31e;display: flex;flex-direction: column;justify-content: space-evenly;align-items: center;padding-top: 3em;}
.detail p{font-size:32px;line-height:1.5;}
.detail p>a{text-decoration:underline;}
.detail a.link{width:auto;padding: 0.2em 2em 0.5em;background-color:white;margin:30px 0;}
.detail a.link:hover{background-color:#006834;color:white;}
.footbg{width:100%;height:170px;background:#006834 url("./images/footbg.jpg") no-repeat top center / cover;position:relative;}
.footbg div{display: flex;flex-direction: column;justify-content: center;align-items: center;padding-top: 2.5em;}
.footbg h5{font-size:24px;}
.footbg p{font-size:18px;line-height:1.5;}
.footmenu{width:100%;height:60px;background:#006834;position:relative;}
.footmenu ul{display: flex;width:60%;justify-content: space-evenly;position:absolute;bottom:15px;left:50%;transform:translateX(-50%);}
.footmenu ul a{color:white;font-size:15px;}

#slidewrap {height:100vh; position: relative;}
#slider{width:1020px;height:100%;margin:0 0 0 auto;}
#slidewrap img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin-left:-320px;}

.container>article {border-right:60px solid #0a6133;}
.logo4 {display:block;margin:0 auto;padding-bottom: 60px;}

#issei{height:100vh;display:flex;align-items:center;}
#issei>img{width:600px;}
#issei>div{display: flex;justify-content: center;align-items: center;width:100%;}
#issei>div p{font-size:32px;font-family: "Sawarabi Mincho", serif;font-weight: 400;line-height:calc(50vh/6);}
#issei>div p:nth-child(5){font-size:28px;}

#index .content{display:flex;align-items:stretch;gap: 0 30px;padding:60px 0;}
#index .content:nth-of-type(odd){flex-direction:row-reverse;}
#index .content>div:nth-child(1){display:flex;flex-direction:column;justify-content:space-between;padding-right:10px;}
#index .content>div:nth-child(2){display:flex;flex-wrap:wrap;justify-content:space-around;gap:10px 50px;}
#index .content>div>img{width:600px;}
#index .content>div>figure{display:flex;flex-direction:column;width:260px;}
#index .content>div>figure>img{width:auto;}
#index .content>div>figure>figcaption{text-align:center;}
#index .container>div{text-align:center;width:1280px;margin:0 auto;border-right:60px solid #0a6133;}
#index .construct{background-color:#b3d465;text-align:right;padding:30px 0;}
#index .construct h3{padding: 0.5em 3em;}
#index .construct>div{display:flex;flex-direction:column;}
#index .construct>div>div{display:flex;flex-direction:row;justify-content:space-around;align-items:center;margin-bottom:60px;}
#index .construct>div figure{display:flex;flex-direction:column;width:36%;}
#index .construct>div figure>img{width:auto;}
#index .construct>div figure>figcaption{text-align:center;font-size:larger;font-weight:bold;}
#index .video{height:auto;display:flex;flex-direction:row;justify-content:space-around;margin-bottom:60px;}
#index .video>video{max-height:100vh;max-width:45vw;}

#header>article{height:400px;display:flex;align-items:center;}
h1{font-family: "Noto Sans JP", sans-serif;font-weight:400;font-size:40px;color:white;margin-left:6em;margin-top:-1.5em;position:relative;line-height:2;letter-spacing:0.1em;
background-image : linear-gradient(to right, #FFF, #FFF 6px, transparent 6px, transparent 8px);  /* 幅2の線を作る */
  background-size: 8px 2px;          /* グラデーションの幅・高さを指定 */
  background-position: left bottom;  /* 背景の開始位置を指定 */
  background-repeat: repeat-x;}
h1:after{content:attr(data-text);position:absolute;left:0;bottom:-2em;font-family: "Sawarabi Mincho", serif;font-weight: 400;}
h2{width:100%;font-family: "Noto Sans JP", sans-serif;font-weight:400;font-size:36px;line-height:2;letter-spacing:0.1em;color:black;margin-bottom: .5em;
background-image : linear-gradient(to right, #c89f62, #c89f62 6px, transparent 6px, transparent 8px);background-size: 8px 2px;background-position: left bottom;background-repeat: repeat-x;}

#about #header>article{background:url("./images/header_about.jpg") no-repeat center center / cover;}
#about article{text-align:center;padding-top:30px;}
#about .tbl{display:block;background-color:#604c3f;padding:30px 0;}
#about table{margin:0 auto;width: 60%;}
#about th,
#about td{color:white;border:1px solid white;padding:0.5em 1em;}
#about th{border-left:none;width:6.5em;text-align:center;}
#about td{border-right:none;}
#about tr:first-child th,
#about tr:first-child td{border-top:none;}
#about tr:last-child th,
#about tr:last-child td{border-bottom:none;}

#services #header>article{background:url("./images/header_services.jpg") no-repeat center center / cover;}
.lead{display:flex;justify-content:center;align-items:center;padding: 120px 0;}
#services .content{display:flex;align-items:stretch;gap: 0 30px;padding:0 30px 60px;}
#services .content>div{width:50%;min-height:300px;position:relative;}
#services .content>div>img{border:3px solid rgba(140,140,140,0.5);}
#services .content>div>img:first-child{position:absolute;top:0;left:0;}
#services .content>div>img:last-child{position:absolute;bottom:0;right:0;}

.mark{}
.marker {background:linear-gradient(transparent 70%, rgba(255, 220, 123) 70%);display: inline-block;background-repeat: no-repeat;
transition:background-size 1.5s;background-size: 0% 100%;margin:.5em 0;}
.marker::first-letter{font-size:150%;color:red;}
.marker.on {background-size: 100% 100%;}
.delay1500ms{transition-delay:1500ms;}
.delay2500ms{transition-delay:2500ms;}

#recruit article{text-align:center;}
#recruit #header>article{background:url("./images/header_recruit.jpg") no-repeat center center / cover;}
#recruit .content{display:flex;align-items:stretch;gap: 0 30px;padding:0 30px 60px;text-align:left;}
#recruit .content>div{width:50%;min-height:300px;position:relative;}
#recruit .content div>p{font-size:24px;}
#recruit .tbl{display:block;padding:30px 0 60px;text-align:center;}
#recruit table{margin:0 auto;width: 60%;}
#recruit th,
#recruit td{border:1px solid #604c3f;padding:0.5em 1em;}
#recruit th{color:white;border:1px solid white;background-color:#604c3f;text-align:center;width:8em;}
#recruit td{}
#recruit tr:first-child th{border-top:1px solid #604c3f;}
#recruit tr:last-child th{border-bottom:1px solid #604c3f;}

#contact{}
#contact #header>article{background:url("./images/header_contact.jpg") no-repeat center center / cover;}
#contact .container{}
#contact .container article{text-align:center;padding:60px 0 30px;display:flex;flex-direction:column;justify-content:center;align-items:center;}
#contact .table{margin-top:30px;width:70%;}
#contact .table>div{display:flex;align-items:stretch;width:100%;margin:auto;}
#contact .table>div:not(:first-of-type) span{border-top:none!important;}
#contact .table span{display:flex;align-items:center;border:solid 1px #0070C0;padding:0.5em;font-size:18px;text-align:left;position:relative;min-height:3em;}
#contact .table span:first-child {width:40%;border-left:none!important;border-right:none!important;}
#contact .table span:nth-child(2) {width:60%;border-right:none!important;}
#contact .table sub{font-size:10px;width:4em;color:white;background-color:#604c3f;display:block;text-align:center;line-height:2em;position:absolute;right:1em;top:50%;transform:translateY(-50%);}
#contact .table input[type="radio"]{margin-left:2em;}
#contact .table input[type="text"],
#contact .table textarea{font-size:18px;line-height:1.2em;width:100%;padding:.5em;}
#contact .table textarea{height:5em;}
#contact .ppbuttom{width:20em;background-color:#DEEBF7;color:black;font-weight:normal;text-align:center;font-size:18px;padding:0.5em;display: flex;justify-content: center;align-items:center;margin: 30px auto;}
#contact .ppbuttom>sub{font-size:10px;width:4em;color:white;background-color:#604c3f;display:inline-block;text-align:center;line-height:2em;}
#contact .ppbuttom label{font-size:18px;padding:0 0.5em;}
#contact .ppbuttom label:after{content:"☐";}
#contact #switch{display:none;}
#contact #kakunin{cursor:pointer;pointer-events:none;color:#ddd;width:34em;font-size:18px;padding:0.5em 0;background-color:white;}
#contact #switch:checked ~ #kakunin{pointer-events:auto;color:white;background-color:#604c3f;}
#contact #switch:checked ~ .ppbuttom label:after{content:"☒";}
#contact .privacytext{border:1px solid black; padding:1em;width:70%;}
#contact .privacytext strong{font-size:14pt;line-height:3em;}
#contact .privacytext p{margin-bottom:1em;margin: 0 0 1em 0 !important;}

#contact table.table{width:100%;margin:30px 0;}
#contact .table th {width:40%;border-left:none!important;border-right:none!important;border:1px solid #0070C0;padding:.5em;}
#contact .table td {width:60%;border-right:none!important;border:1px solid #0070C0;padding:.5em;}
#contact #ButtonArea{display: flex;justify-content: space-around;}
#contact #ButtonArea input{color: white;background-color: #604c3f;width:40%;padding:0.5em;}
#contact #ButtonArea input[type="button"]{color: #604c3f;background-color: white;}

#contact .kanryou{padding:80px 1em 240px;}
#contact .kanryou>p{font-size:24px;}

@media screen and (max-width: 767px) {
.pc{display:none!important;}
.sp{display:inherit;}
article{width:100vw;}
#goto-top{left:auto;right:10px;margin-left:0;color:#0a6133;background:rgba(255,255,255,0.5);border: 1px solid #0a6133;}
#goto-top::before{border-top: 2px solid #0a6133;border-right: 2px solid #0a6133;}
#logo_g{left:10px;top:10px;margin:0;}
#logo_g>img{display:none;}
#tel{left:165px;top:0px;margin:0;}
#tel{background:url('./images/btn_tel2.png') no-repeat;}
#menu_top>div{width:100%;}
#slidewrap{height:50vh;}
#slidewrap img{width:60%;margin-left:0;top:85%;}
#slider{width:100%;margin:0;}
h1{margin-left:auto;right:1em;margin-top:0;}
h3{font-size:32px;}
.container>article{border-right:none;flex-direction:column;padding: 0 6px;margin:60px 0;}
.logo4{width:80%;padding-bottom:0;}
#index .content:nth-of-type(odd){flex-direction:column-reverse;}
#issei{margin:0;height:50vh;}
#issei>img{display:none;}
#issei>div{height:100%;padding:0;display:flex;justify-content:center;align-items: center;}
#issei>div>div{padding-bottom: 60px;max-height:50vh;}
#index .content{padding:0 0 60px;}
#index div.content{width:100vw;border-right:none;}
#index .content>div{height:auto;}
#index .content>div>img{width:100%;object-fit:contain;}
#index .content>div>figure{display:flex;flex-direction:column;width:40%;justify-content:space-around;}
#index .content>div>figure>img{width:auto;}
#index .construct h3{padding: 0.5em 1em;}
#index .construct>div>div>img{width:50px;}
#index .video{flex-direction:column;gap:30px 0;}
#index .video>video{max-height:100vh;max-width:100vw;}
.detail{flex-direction:column;}
.detail>div{width:100%;}
.footbg{background-size:auto;}
.footbg div{padding-top: 2.5em;}
.footbg p{font-size:12px;}
.footmenu ul{width:80%;bottom:15px;left:10px;transform:translateX(0);}
#about table{width: 90%;}
#services .lead p{padding:0 1em 0.5em;text-align:center;}
#services .content{gap:30px 0;}
#services .content>div{width:100%;}
#services .content>div>img{width:240px;}
#recruit .lead p{padding:0 1em 0.5em;text-align:center;}
#recruit .content{padding-bottom:0;}
#recruit .content>div{width:100%;}
#recruit .content>div>img{width:100%;}
#recruit table{width: 90%;}
#contact .table{width:100%;}
#contact .privacytext{width:100%;}
#contact #kakunin{width:90%;}
#contact .table span{font-size:15px;}
#contact .table sub{font-size:9px;}
#contact .table input[type="text"],
#contact .table textarea{font-size:15px;}
#contact .kanryou{padding-bottom:60px;}
#contact .kanryou>p{font-size:16px;margin-bottom:0.5em;}
}