@charset "utf-8";
/* ===================================================
	Home CSS
====================================================== */
/* ---------------------------------------------------

------------------------------------------------------ */
#main_img { position: relative; padding: 0; margin: 25px 60px 0 0;}
#main_img .slick-slide div { vertical-align: bottom;}
#main_img img { width: 100%;}
#main_img .slick img {
	width: 100%;
	height: calc(100vh - 32px);
	max-height: 100vh;
	opacity: 1;
	transition: opacity 1s linear, transform 8s linear;
	transform: scale(1);
}
#main_img .slick .slick-slide.active img {
	transform: scale(1.1);
}
#main_logo { position: absolute;
	z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);}


#main_logo img { -webkit-filter: drop-shadow(0px 3px 10px rgba(46, 36, 27, 0.8)); /* SafariなどのWebkitブラウザ用 */
filter: drop-shadow(0px 3px 10px rgba(46, 36, 27, 0.5)); }
#main_logo img:nth-of-type(1) { width: 348px; display: block; margin: 0 0 20px;}
#main_logo img:nth-of-type(2) { width: 353px;}

.btn_insta { display: block; border: 1px solid #000; border-radius: 50px; text-align: center; width: 262px; padding: 13px 0; color: #000;}
.btn_insta span { padding: 0 0 0 30px; background: url(../img/icon_insta.svg)no-repeat left center;}

.btn_access { display: block; border: 1px solid #000; border-radius: 50px; text-align: center; width: 262px; padding: 13px 0; color: #000;}
.btn_access span { padding: 0 0 0 30px; background: url(../img/icon_access.svg)no-repeat left center;}



@media (hover: hover) {

}

@media screen and (max-width: 600px) {
    #main_img { margin: 60px auto 0; width: 92%;}
    #main_img .slick img { height: calc(100vh - 60px);}
    .btn_insta,
    .btn_access { padding: 10px 0;}
    
}


/* ---------------------------------------------------
sec_lead
------------------------------------------------------ */

#sec_lead { padding: 96px 0 0;}
#sec_lead section { overflow: hidden;}
#sec_lead .flex_col { margin-left: calc(50vw - 600px); margin-bottom: 100px;}
#sec_lead .flex_col >div { width: 700px;} 
#sec_lead .flex_col h2 { margin: 0 0 15px; font-size: 60px; line-height: 1.5;}
#sec_lead .flex_col h2 .en { display: block; font-size: 70px; color: #f163b2;}
#sec_lead .flex_col > img { width: calc(94% - 610px); height: 700px;}
#sec_lead .flex_col .sec_txt { line-height: 2.5; padding: 0 120px 0 0;}
#sec_lead .flex_col+ul { display: flex; justify-content: right;}
#sec_lead li img { width: 100%;}
#sec_lead .flex_col+ul li:nth-of-type(1) { width: 34%; min-width: 507px;}
#sec_lead .flex_col+ul li:nth-of-type(2) { width: 15%; min-width: 225px; margin: 132px 6% 0 13%;}
#sec_lead .flex_col+ul li:nth-of-type(3) { width: 29%; min-width: 432px; margin: 175px 0 0;}
#sec_lead .flex_col+ul+ul { display: flex; justify-content: left;}
#sec_lead .flex_col+ul+ul li:nth-of-type(1) { min-width: 690px; width: 46%; margin-right: 11%;}
#sec_lead .flex_col+ul+ul li:nth-of-type(4){ min-width: 530px; width: 35%; margin: 204px 0 0;}

@media screen and (max-width: 1440px) {
#sec_lead .flex_col+ul li:nth-of-type(1),
#sec_lead .flex_col+ul li:nth-of-type(2),
#sec_lead .flex_col+ul li:nth-of-type(3) { min-width: auto;}
}

@media screen and (max-width: 1400px) {
#sec_lead .flex_col+ul+ul li:nth-of-type(1) { min-width: 46%;}
#sec_lead .flex_col+ul+ul li:nth-of-type(2) { min-width: 35%;}
}

@media screen and (max-width: 1300px) {
#sec_lead .flex_col { max-width: 94%; margin: 0 0 100px auto;}
}

@media screen and (max-width: 600px) {
    #sec_lead { padding: 20px 0 0;}
    #sec_lead .flex_col { display: block; margin: 0 auto; width: 90%;}
    #sec_lead .flex_col >div { width: 100%;}
    #sec_lead .flex_col h2 { margin: 0 0 20px; font-size: 35px; line-height: 1.5;}
    #sec_lead .flex_col h2 .en { margin: 0 0 10px; font-size: 10vw; line-height: 1.2;}
    #sec_lead .flex_col .sec_txt { padding: 0 0 30px; line-height: 2;}
    #sec_lead .flex_col .sec_txt p { padding: 0 0 20px;}
    #sec_lead .flex_col > img { margin: 0; width: 100%; height: auto;}

    #sec_lead .flex_col+ul { display: block; width: 90%; margin: auto;}
    #sec_lead .flex_col+ul li:nth-of-type(1),
    #sec_lead .flex_col+ul li:nth-of-type(3) { width: auto; min-width: auto;}
    #sec_lead .flex_col+ul li:nth-of-type(1) { margin: 20px 0 0; width: 80%;}
    #sec_lead .flex_col+ul li:nth-of-type(2) { display: none;}

    #sec_lead .flex_col+ul+ul  { flex-wrap: wrap; margin: 30px 0 0; justify-content: space-between;}
    #sec_lead .flex_col+ul+ul li:nth-of-type(1),
    #sec_lead .flex_col+ul+ul li:nth-of-type(2),
    #sec_lead .flex_col+ul+ul li:nth-of-type(3),
    #sec_lead .flex_col+ul+ul li:nth-of-type(4) { width: auto; min-width: auto;}

    #sec_lead .flex_col+ul+ul li:nth-of-type(1) { width: 100%; margin: 0;}
    #sec_lead .flex_col+ul+ul li:nth-of-type(2) { margin: 20px 0 0 5%; width: 30%;}
    #sec_lead .flex_col+ul+ul li:nth-of-type(3) { width: 55%; margin: 50px 0 0;}
    #sec_lead .flex_col+ul+ul li:nth-of-type(4) { margin: 20px 0 0 5%; width: 60%;}
}

/* ---------------------------------------------------
sec_menu
------------------------------------------------------ */
#sec_menu { margin: 120px 0;}
#sec_menu h2 { text-align: center; margin: 0 0 50px;}
#sec_menu h2 span { display: block; font-size: 50px;}
#sec_menu ul { display: flex; flex-wrap: wrap; justify-content: space-between;}
#sec_menu ul li { width: calc(25% - 24px); margin-bottom: 75px;}
#sec_menu ul li img { display: block; margin: 0 auto; width: 243px;}
#sec_menu ul p { text-align: center;}
#sec_menu ul+p { text-align: center; margin: 0 0 45px;}
#sec_menu .btn_insta { margin: 0 auto;}

@media screen and (max-width: 600px) {
#sec_menu { margin: 60px 0;}
#sec_menu h2 { margin: 0 0 10px;}
#sec_menu h2 span { font-size: 33px; line-height: 1;}
#sec_menu ul li { width: 49%; margin-bottom: 20px;}
#sec_menu ul p { line-height: 1.6;}
#sec_menu ul+p { line-height: 1.6; margin: 40px 0;}
#sec_menu ul li img { width: 162px;}
}

/* ---------------------------------------------------
sec_insta
------------------------------------------------------ */
#sec_insta { padding: 183px 0; background: url(../../img/insta_bg1.gif)repeat-x top,url(../../img/insta_bg2.gif)repeat-x bottom,url(../../img/insta_bg3.gif);}

#sec_insta h2 { text-align: center; font-size: 50px;}
#sec_insta h2+p { margin: 0 0 60px; text-align: center;}
#sec_insta ul { display: flex; flex-wrap: wrap; justify-content: space-between; width: 830px; margin: 0 auto 65px;}
#sec_insta ul li { margin: 0 0 10px; width: 32.5%;}
#sec_insta .btn_insta { margin: 0 auto;}


@media screen and (max-width: 600px) {
    #sec_insta { height: 110vh; padding: 0; background-size: 40%; display: flex; align-items: center;}
    #sec_insta h2 { font-size: 33px;}
    #sec_insta ul { width: 100%; margin: 0 0 4vh;}
    #sec_insta ul li { height: 24vh;}
    #sec_insta ul li img { width: 100%; height: 100%;}
    #sec_insta h2+p { margin: 0 0 3vh;}
}

/* ---------------------------------------------------
sec_access
------------------------------------------------------ */
#sec_access { padding: 85px 0; background: url(../../img/access_bg.gif);}
#sec_access h2 { padding: 0 0 60px; text-align: center; line-height: 1.8;}
#sec_access h2 span { display: block; font-size: 50px;}
#sec_access iframe { width: 100%; height: 500px; filter: grayscale(50%); -webkit-filter: grayscale(50%);}
#sec_access .address_col { display: flex; justify-content: center; margin: 65px 0 0;}
#sec_access .address_col img { margin: 0 12% 0 0; width: 150px;}
#sec_access .address_col div p:nth-of-type(1) { padding: 0 0 10px; font-size: 24px; font-weight: bold;}
#sec_access .address_col a { margin-top: 20px;}

@media screen and (max-width: 600px) {
    #sec_access { padding: 50px 0 100px;}
    #sec_access h2 { padding: 0 0 40px;}
    #sec_access h2 span { font-size: 33px; line-height: 1;}
    #sec_access .address_col { display: block; width: 100%; text-align: center; margin: 20px 0 0;}
    #sec_access .address_col img { margin: 0 auto; width: 80px;}
    #sec_access iframe { height: 300px;}
    #sec_access .address_col a { margin: 20px auto 0;}
}
