/*
HAMBURGER
-----------------------------------------------------*/

#hamburger_top {
display: none;
position: absolute;
width: 50px;
height: 49px;
border: none;
right: 0;
top: 0;
cursor: pointer;
z-index: 200;
background: rgba(25,100,53,0.85);
}

.burger-btn{
display: block;
height:20px;
position: absolute;
border: none;
cursor: pointer;
top: 14px;
width: 36px;
left: 7px;
}
.burger-btn .bar{
width: 36px;
height: 1px;
display: block;
position: absolute;
left: 0;
background-color: rgba(255,255,255,0.7);
}
.burger-btn .bar_top{
top:0;
transition: 0.3s;
}
.burger-btn .bar_mid{
display: block;
top: 46%;
transition: 0.2s;
}
.burger-btn .bar_bottom{
bottom: 0;
transition: 0.3s;
}


/* FIRST VIEW */

section#firstview{
padding: 0 0;
}
#firstview{
width: 100%;
height: 100vh;
text-align: center;
position: relative;
}

.top_screen{
width: 100%;
position: relative;
}

#top_mainslide {
width: 100%;
height: 100vh;
min-height: 600px;
position: relative;
overflow: hidden;
}

#top_mainslide_sp {
width: 100%;
height: 100vh;
position: relative;
overflow: hidden;
}

#top_gmenu{
position: absolute;
bottom: 0;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
background: rgba(25,100,53,0.85);
color: #fff;
z-index: 5;
font-family: "dnp-shuei-mgothic-std", sans-serif;
font-weight: 200;
font-style: normal;
height: 60px;
padding: 22px 0;
}
#top_gmenu li{
font-size: 16px;
line-height: 18px;
padding: 0 1.8em;
border-right: solid 1px #fff;
}
#top_gmenu li:last-of-type{
border-right: none;
}
#top_gmenu a{
color: #fff;
text-decoration: none;
}
#top_gmenu a:hover{
color: #f5ff50;
text-decoration: none;
}
.top_trial{
position: absolute;
background: rgba(25,100,53,0.85);
display: table;
bottom: 84px;
right: 20px;
z-index: 5;
transition: 0.3s;
}
.top_trial:hover{
background: #004e0f;
}
#top_logo{
width: 70%;
max-width: 437px;
text-align: center;
display: table;
background: rgba(25,100,53,0.85);
position: absolute;
left: 0;
right: 0;
top: 31vh;
margin: auto;
z-index: 6;
}
#top_logo_sp{
width: 74%;
text-align: center;
display: table;
background: rgba(25,100,53,0.85);
position: absolute;
left: 0;
right: 0;
top: 35vh;
margin: auto;
z-index: 6;
}
@media screen and (max-height:800px){
#top_logo{
top: 26vh;
}
}



/* TOP INRTO */
section#top_intro{
text-align: center;
padding: 60px 0 0;
}
section#top_intro h2{
font-size: 38px;
line-height: 1.4;
padding-bottom: 40px;
}
section#top_intro h3{
font-size: 28px;
line-height: 2;
padding-bottom: 30px;
}
section#top_intro h4{
font-size: 24px;
line-height: 1.8;
padding-bottom: 40px;
}
section#top_intro p{
font-size: 105%;
}
.intro_samplepic{
width: 100%;
max-width: 920px;
margin:20px  auto 40px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.intro_sample{
width: 32%;
}
.intro_samplepic_sp{
display: none;
}



/* TOP MENU */
section#top_menu{
text-align: center;
padding: 0  0 50px;
}
section#top_menu .icon{
width: 70px;
margin: 20px auto 40px;
}
section#top_menu h3{
font-size: 34px;
line-height: 2;
padding-bottom: 30px;
}
.top_menu_wrap{
position: relative;
width: 100%;
max-width: 1100px;
margin:30px  auto 15px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 10px;
}
.top_menu_box{
background:#F3F3E4;
position: relative;
width: 32.5%;
padding: 60px 0 25px;
}
.top_menu_box h4{
text-align: center;
font-size: 24px;
font-feature-settings:normal;
line-height: 1.3;
height: 3.5em;
display: grid;
place-content:center;
}
.top_menu_box h4.tsume{
font-feature-settings: "palt";
}
.top_menu_box p{
text-align: justify;
width: 80%;
margin: auto;
padding-bottom: 0;
}
.top_menu_icon{
width: 120px;
overflow: hidden;
border-radius: 60px;
position: absolute;
top: -60px;
z-index: 2;
left: 0;
right: 0;
margin: auto;
transition: 0.3s;
}
.top_menu_icon:hover{
transform: translateY(-5px);
}
.top_menu_deco1{
position: absolute;
top: 0;
left: 0;
}
.top_menu_deco2{
position: absolute;
top: 0;
right: 0;
}
.top_menu_deco3{
position: absolute;
bottom: 0;
left: 0;
}
.top_menu_deco4{
position: absolute;
bottom: 0;
right: 0;
}
.linkbtn{
width: 95%;
max-width: 420px;
margin: auto;
padding: 3px;
text-align: center;
background: #196435;
transition: 0.3s;
}
.linkbtn a{
border: solid 1px rgba(255,255,255,0.4);
text-decoration: none;
color: #FFF;
display: block;
font-family: "dnp-shuei-mgothic-std", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 100%;
line-height: 2.8;
padding-bottom: 0;
}
.linkbtn a:hover{
color: #f5ff50;
}
.linkbtn:hover{
background: #11853c;
transform: translateY(-5px);
}



/* TOP GALLERY */
section#top_gallery{
text-align: center;
padding: 0  0 50px;
}
section#top_gallery .icon{
width: 45px;
margin: 20px auto 40px;
}
section#top_gallery h3{
font-size: 34px;
line-height: 2;
padding-bottom: 30px;
}
.top_gallery_wrap{
position: relative;
width: 100%;
max-width: 1100px;
margin:0  auto 15px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 10px;
}
.top_gallery_box{
width: 19.2%;
}
.top_gallery_box:nth-child(6){
display: none;
}


/* TOP INSTAGRAM */
section#top_insta{
text-align: center;
padding: 0  0 50px;
}
section#top_insta .icon{
width:55px;
margin: 20px auto 40px;
}
section#top_insta h3{
font-size: 30px;
line-height: 2;
padding-bottom: 30px;
}



@media screen and (max-width:1024px){
#footer_menu{
text-align: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 50px 0;
}
#footer_menu li{
font-size: 13px;
line-height: 28px;
padding: 0 1em;
font-family: "dnp-shuei-mgothic-std", sans-serif;
font-weight: 400;
font-style: normal;
}
#footer_menu a{
color: #fff;
text-decoration: none;
}
#footer_menu a:hover{
color: #f5ff50;
text-decoration: none;
}

#footer_menu li.trial{
background: rgba(255,255,255,0.05);
line-height: 18px;
border: solid 1px rgba(255,255,255,0.3);
padding: 4px 1em;
margin-left: 2em;
}
#footer_menu li.trial img{
display: inline-block;
width: 1.4em;
vertical-align: sub;
padding-right: 3px
}
}

@media screen and (max-width:920px){
#hamburger_top {
display: block;
}
#top_gmenu{
display: none;
}

.top_trial{
display: none;
}
.modal_logo{
text-align: center;
color: #fff;
display: table;
margin:  0 auto 20px;
}
.modal_logo h5{
width: 170px;
margin: auto;
padding-bottom: 4px;
}
.modal_logo h6{
font-family: "dnp-shuei-ymincho-std", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
border-top: solid 1px rgba(255,255,255,0.8);
}
#modal_menu li{
font-size: 100%;
line-height: 3.5;
}
.top_menu_box h4{
font-size: 20px;
}
}


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

.top_menu_wrap{
position: relative;
width: 100%;
margin:30px  auto 15px;
display: block;
padding: 10px;
}
.top_menu_box{
background:#F3F3E4;
position: relative;
width: 100%;
padding: 25px;
margin-bottom: 20px;
}
.top_menu_box.box_last{
margin-bottom: 0;
}
.top_menu_box h4{
top: 15px;
text-align: left;
font-size: 24px;
font-feature-settings: normal;
line-height: 1.3;
height: 120px;
position: absolute;
left: 145px;
place-content: center;
}
.top_menu_box p{
text-align: justify;
width: 100%;
margin: auto;
padding-bottom: 0;
padding-top: 15px;
}
.top_menu_icon{
width: 100px;
overflow: hidden;
border-radius: 50px;
position: relative;
margin: 0;
top: auto;
left: auto;
right: auto;
}

.top_gallery_box{
width: 32%;
margin-bottom: 2%;
}
.top_gallery_box.box6{
display: block;
}

.top_gallery_box:nth-child(6){
display: block;
}

}



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

br.under600{display: block;}

#footer_menu {
display: block;
padding: 20px 0;
}
#footer_menu li{
font-size: 90%;
line-height: 2.5;
text-align: center;
padding: 0;
}

#footer_menu li.trial{
background: rgba(255,255,255,0.05);
line-height: 18px;
border: solid 1px rgba(255,255,255,0.3);
padding: 4px 2em;
margin: 15px auto 0;
display: table;
}
#footer_menu li.trial img{
display: inline-block;
width: 1.4em;
vertical-align: sub;
padding-right: 3px
}

section#top_intro h2{
font-size: 26px;
line-height: 1.4;
padding-bottom: 40px;
}
section#top_intro h3{
font-size: 20px;
line-height: 2;
padding-bottom: 30px;
}
section#top_intro h4{
font-size: 18px;
line-height: 1.8;
padding-bottom: 40px;
}
section#top_intro p{
font-size: 90%;
text-align: left;
}
section#top_intro p br{
display: none;
}
.intro_samplepic{
display: none;
}
.intro_samplepic_sp{
display: block;
width: 80%;
max-width: 350px;
margin: 10px auto 20px;
padding: 3px;
border: solid 1px rgba(25,100,53,0.7);
}

.top_menu_icon{
width: 80px;
overflow: hidden;
border-radius: 40px;
position: relative;
margin: 0;
top: auto;
left: auto;
right: auto;
}
.top_menu_box h4{
top: 15px;
text-align: left;
font-size: 20px;
font-feature-settings: normal;
line-height: 1.3;
height: 100px;
position: absolute;
left: 125px;
place-content: center;
}
}


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

br.over500{display: none;}
br.under500{display: block;}

#modal_menu li{
font-size: 90%;
}
.modal_logo h5{
width: 120px;
margin: auto;
padding-bottom: 4px;
}
.modal_logo h6{
font-family: "dnp-shuei-ymincho-std", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
border-top: solid 1px rgba(255,255,255,0.8);
}
section#top_menu h3{
font-size: 30px;
line-height: 2;
padding-bottom: 0;
}
.top_menu_box h4{
font-size: 19px;
left: 120px;
}
.top_gallery_box{
width: 49%;
margin-bottom: 2%;
}
}