﻿@charset "utf-8";
/* ---------- 全体 ---------- */

*:focus {outline:none;}
.linkStyle{color: #fff; text-decoration: underline;}
html, body{
	font-size: 16px;
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
body{-webkit-text-size-adjust: 100%;}
.fa-phone:before {content: "\f095";}
.tel i {transform: rotate(100deg);}

#page_top{
    top: 0;
    bottom: 0;
    margin: auto;
    right: 25px;
    z-index: 4;
    width: 50px;
    height: 160px;
}
#page_top a{
    width: 50px;
    height: 160px;
    box-sizing: border-box;
}
#page_top .scroll_u{
    width: 1px;
    height: 50px;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
}
#page_top .scroll_u .scroll_bar{
	animation: lineu 2s ease 0s infinite;
}
@keyframes lineu {
	0% {
		top: 50px;
		height: 0;
	}
	20% {
		top: 0;
		height: 50px;
	}
	40% {
		top: 0;
		height: 0;
	}
	100% {
		top: 0;
		height: 0;
	}
}
#page_top .scroll_block{
	width: 50px;
	height: 50px;
}
#page_top .scroll_block::before{
	width: 10px;
	height: 10px;
	right: 0;
	left: 0;
	top: 5px;
	bottom: 0;
	margin: auto;
	border-left: solid 2px #fff;
	border-top: solid 2px #fff;
	transform: rotate(45deg);
}

.linkStyle:hover{opacity: 0.7}
.hvr_trans:hover{transform: translateY(-5px)}
#contents1-1 .con1_title::before, #page_top .scroll_block::before{
	position: absolute;
	display: block;
	content: "";
	pointer-events: none
}
#loader{
	top: 0;
	left: 0;
	z-index: 10
}
#loader .loader_wrap{
	width: 200px;
	height: 200px
}
#loader .loader_wrap .loader_right, #loader .loader_wrap .loader_left{
	width: 100px;
	height: 100px;
	transform: rotate(45deg);
}
#loader .loader_wrap .loader_right{
	top: 50px;
	right: 48px
}
#loader .loader_wrap .loader_left{
	bottom: 49px;
	left: 49px
}
#page_title .page_title_bg{
	top: 0;
	left: 0
}
#page_title .page_title_gradient{
	left: 0;
	bottom: -1px;
	height: 100px;
}

.more a{	
	display: inline-block;
	background:#165e80;
	color:#fff;
	border:none;
	position:relative;	
	font-size: 1.4em;
	letter-spacing: 1.5px;
	padding: 0.8em 2em;
	cursor:pointer;
	transition:0.8s ease all;
	outline:none;
}
.more a:hover{
  background:rgba(255,255,255,0.05);
  color:#165e80;
}
.more a:before,.more a:after{
  content:'';
  position:absolute;
  top:0;
  right:0;
  height:1px;
  width:0;
  background: #165e80;
  transition:0.4s ease all;
	-webkit-backface-visibility:hidden;
 	backface-visibility:hidden;
	-webkit-overflow: hidden;
}
.more a:after{
  right:inherit;
  top:inherit;
  left:0;
  bottom:0;
}
.more a:hover:before,.more a:hover:after{
  width:100%;
  transition:0.8s ease all;
	-webkit-backface-visibility:hidden;
 	backface-visibility:hidden;
	-webkit-overflow: hidden;
}


/***　言語切替　***/
#lang_nav{
	top: 0;
    right: 3%;
    z-index: 10;
}
.lang_menu {  
   padding:0;
   margin:0;
   overflow: hidden;
   position: relative;
}
.lang_menu li {
   width:100px; 
   position: relative;
   height:40px;
}
.lang_menu li a {
   text-decoration:none;  
   font-size:0.6vw;
   display:block;
   padding:0 10px;
   height:39px;
   line-height:39px;
}
.lang_menu li ul {
   margin:0;
   padding:0;
}

.lang_menu .drop_2row:hover {
   height:159px;
}

.lang_menu * {/*アニメーション*/
   -moz-transition: .5s;
   -webkit-transition: .5s;
   -o-transition: .5s;
   -ms-transition: .5s;
   transition: .5s;
}

/***　ヘッダー　***/

#header{
	top: 0;
	left: 0;
	z-index: 5;
	background-color: rgba(255, 255, 255, 0.01);
}
#header.headtrans{background-color: rgba(122,122,122,0.5)}
#header.headtrans #logo a{padding: 10px 50px}
#header .menu_stick{
	width: 50px;
	height: 50px;
	z-index: 7;
	top: 0;
	bottom: 0;
	margin: auto;
	right: 10px;
	box-sizing: border-box
}
#header .menu_stick span{
	height: 2px;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	transition: 0.5s;
}
#header .menu_stick span:first-of-type{top: 14px}
#header .menu_stick span:last-of-type{bottom: 14px}
#header .menu_stick.stick_trans span:first-of-type,#header .menu_stick.stick_trans span:last-of-type{
	top: 0;
	bottom: 0;
	margin: auto;
	background-color: #fff
}
#header .menu_stick.stick_trans span:not(:first-of-type):not(:last-of-type){background-color: transparent}
#header .menu_stick.stick_trans span:first-of-type{transform: rotate(225deg)}
#header .menu_stick.stick_trans span:last-of-type{transform: rotate(-225deg)}
#header #sp_nav{
	top: 0;
	left: 0;
	z-index: 6
}


/***　フッター　***/
footer .map {
height: 0;
overflow: hidden;
padding-bottom: 25%;
position: relative;
}
footer .map iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
#footer .grid_6:last-of-type{
    background-color: #edc9dc;
}
#footer .grid_6:last-of-type p{
    font-size: 1.5em;
}
#footer .grid_6:last-of-type p,#footer .grid_6:last-of-type p a{
    color: #a71a52;
}
#copyright{background-color: #f6f9fe;}


/***　index　***/
#pc_nav ul li a{font-weight:700;}
.main_fade1.fadetrans, .main_fade2.fadetrans, .fadein.fadetrans{
	opacity: 1;
	transform: none
}
#main_img { 
  height: 100vh!important;
}
#main_img video{ 
 min-width: 100%;
  min-height: 100vh;	
}
/*
#main_img {
  background-image: url("../img/main_img.jpg");
  background-size: cover;
  height: 100vh;
}
*/
#main_img .main_bg{
	top: 0;
	left: 0;
	z-index: 1
}
#main_img .main_txt_wrap{
	right: 0;
	bottom: 200px;
	z-index: 1
}
main:before{
	position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background:url(../img/back.jpg) no-repeat;
    -webkit-background-size:cover;
    background-size: cover;
	background-position: 50% 65%;
    content:"";	
}

.blink_dia{
    animation:blink 1s ease-in-out infinite alternate;
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
.contents_sub_title{
	top: 24px;
    left: 2.5%;
    z-index: 0;
    color: #e2e2e2;
    font-size: 7vw;
    text-align: center;
}

.contents_sub_title span{
background: -webkit-linear-gradient(0deg, #64b7e4, #d270ad, #d4e287, #80caa9, #64b7e4, #d270ad, #d4e287);
	-webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	opacity: 0.75;
}

.contents_title{
	position: relative;
	margin-left: 0.5%;
    letter-spacing: 1em;
    font-size: 2.5vw;
}
.news .contents_title{margin-top: 4.3%;}
.news .contents_sub_title { top: auto;}
.intro_wrap,
#contents1{background-color: rgba(255, 255, 255, .15);}
#intro .intro_img img{
	width: 100%;
    height: 60vh;
	object-position: 50% 27%;
    object-fit: cover;    
    font-family: 'object-fit: cover;';
}
#intro .intro_img:before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.4);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;	
}
#intro .intro_title{
	width: 45%;
	margin-top: -86px;
    z-index: +1;
    position: relative;
    font-size: 2.5vw;
    line-height: 2;
    letter-spacing: 6px;
	color: #f52bc0;
    background: -webkit-linear-gradient(110deg, #718e9c, #b37a7f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;	
}
#intro,#contents1-1{
	line-height: 1.8;
    letter-spacing: 2px;
}


.glowAnime span{opacity: 0;}
.glowAnime.glow span{ animation:glow_anime_on 1s ease-out forwards; }

@keyframes glow_anime_on{
  0% { opacity:0; text-shadow: 0 0 0 #ea2cca,0 0 0 #ea2cca;}
  50% { opacity:1;text-shadow: 0 0 10px #ea2cca,0 0 15px #ea2cca; }
  100% { opacity:1; text-shadow: 0 0 0 #ea2cca,0 0 0 #ea2cca;}
}

#contents1-1 .con1_img,
#contents1-1 .con1_box,
#contents1-2 .con1-2_img,
#contents1-2 .con1-2_box{z-index:+2;}
#contents1 .con1_bg{
	position: absolute;
    z-index: 0;    
    width: calc(100% - 200px);
    top: 120px;
    left: 0;
    right: 0;
    content: '';
    display: block;
    height: calc(100% - 120px);
    margin: auto;
    background-color: #f3f3f3;
	background-image: url(../img/back2.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 100% 0%;
}
#contents1-1 .con1_bg{
	top: 0;
	left: 0;
}
#contents1-1 .con1_title::before{
	width: 40px;
	height: 2px;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	background-color: #fff
}
#contents1-2{    flex-direction: row-reverse;}
#contents1-2 .con1-2_img img{
	width: 32vw;
    height: 87vh;
	object-fit:none;
	font-family: 'object-fit: none;';  
}
#contents2{overflow:hidden;}
#contents2 .con2_box{
	width: 30%;
    top: 36px;
    left: 2%;    
}
#contents2 .con2_2 .con2_box{
    left: auto;
    right: 3%;
    width: 28%;
    top: 97px;
}
#contents2 .con2_img img{
    width: 100%;
    height: 95vh;
    object-position: 50% 27%;
    object-fit: cover;
    font-family: 'object-fit: cover;';
}
#contents3 .contents_title {
	position: relative;
    margin-left: 3.5%;
    letter-spacing: 0.3em;
    font-size: 2.3vw;
	margin-top: 0.5%;
}

#contents3 .con3_line{border-right:1px solid #ccc;}
#contents3 .con3_sub_t{
	font-size: calc(1rem + 4px);
    font-weight: bold;
    background-color: #fff;
	color:#333;
    margin: 10px 0;
    padding: 5px;
    border-radius: 10px;
    text-align: center;
}


#contents4 .open_bt,#page06 .open_bt {
    position: relative;
    cursor: pointer;
    padding: 2% 3% 2% 50px;
    transition: all .5s ease;
}

#contents4 .open_bt::before,
#contents4 .open_bt::after,
#page06 .open_bt::before,
#page06 .open_bt::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #fff;
    
}
#contents4 .open_bt::before,
#page06 .open_bt::before{
    top:48%;
    left: 18px;
    transform: rotate(0deg);
	transition: all 0.5s;
    
}
#contents4 .open_bt::after,
#page06 .open_bt::after{    
    top:48%;
    left: 18px;
    transform: rotate(-90deg);
	transition: all 0.5s;
}

#contents4 .open_bt.close::before,
#page06 .open_bt.close::before{
  transform: rotate(180deg);	
	transition: all 0.5s;
}

#contents4 .open_bt.close::after,
#page06 .open_bt.close::after{
  transform: rotate(-90deg);
	opacity: 0;
	transition: all 0.5s;
}


#contents4 .box_item,
#page06 .box_item{
	display: none;		
	margin: 0 2% 2% 2%;
	padding: 1% 3%;
}

#contents4 .contents_sub_title,
#page06 .contents_sub_title{ left: 3.2%;}
#contents4 .contents_title,
#page06 .contents_title{
	position: relative;
    margin-left: 0%;
    letter-spacing: 0.3em;
    font-size: 2.2vw;
    margin-top: 0.7%;
}

#contents5 .contents_title {
	position: relative;
    margin-left: 3.5%;
    letter-spacing: 0.5em;
    font-size: 2.5vw;
	margin-top:0.3%;
}
#contents5 .con5_box {
    top: 100px;
    left: 60%;
}
.main_fade1, .main_fade2{
	opacity: 0;
	transform: translateX(-10px)
}
.fadein{
	opacity: 0;
	transform: translateY(10px);
	transition: 1s;
	transition-property: opacity,transform
}



/***　IE対処　***/

@media all and (-ms-high-contrast:none) {
	#main_img .main_txt span{background: linear-gradient(to bottom, #fff 80%, rgba(255,255,255,0) 80%)}
	.lang_menu li a{line-height: 42px;}
	.more a{padding: 0.9em 2em 0.6em;}
	#contents3 .con3_sub_t{padding:9px 5px 2px 5px; }
	#contents4 .open_bt h3{padding: 5px 0px 0px 0px;}
}

/* 文字間隔 */
/* default 1px */
.letter_0{letter-spacing: 0;}
.letter_1{letter-spacing: 0.1em;}
.letter_2{letter-spacing: 0.2em;}
.letter_3{letter-spacing: 0.3em;}
.letter_4{letter-spacing: 0.4em;}
.letter_5{letter-spacing: 0.5em;}
.letter_6{letter-spacing: 0.6em;}
.letter_7{letter-spacing: 0.7em;}
.letter_8{letter-spacing: 0.8em;}
.letter_9{letter-spacing: 0.9em;}
.letter_10{letter-spacing: 1em;}

.float_right{
	float: right
}
.float_left{
	float: left
}
.float_clear{
	float: none
}
.clearfix::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}

.fadeIn {
  opacity: 0;
  transition: 2s;
}
.fadeIn.is-show {
  opacity: 1;
}

@media screen and (max-width: 1130px){
#pc_nav ul li a{font-size: 1.4vw;}
}


/*---------------------------------------------------------------------------*/
@media screen and (max-width: 768px){
	#main_img video{  min-height: auto;}
	main:before{
    width:100%;
    height: 100%;
}
#page_top { display:none;}
	/*#page_top { right: 11px;}*/
#intro .intro_title {
    margin-top: -49px;    
    font-size: 3.5vw;
	}
	#intro .intro_title {
    width: 60%;
	}
	#intro .intro_img img {    
    height: 35vh;
	}
	.news .contents_title {    margin-top: 5.8%;}
	.contents_title {   font-size: 4.5vw;}
	.contents_sub_title {
    top: 106px;    
    left: 3%;
    font-size: 11vw;
}
	#contetns2 .contents_sub_title {
    top: 106px;
    left: 2.5%;
    font-size: 11vw;
}
	#contents3 > div{padding-top: 75px;}
	#contents1 .con1_bg {
    height: 92%;
    width: calc(100% - 50px);
    background-position: 30% 0%;
}
	#contents1-2 .con1-2_img{margin-left: 13%;}
	#contents1-2 .con1-2_img img {
    width: 79vw;
    height: 39vh;
	object-fit: cover;
	font-family: 'object-fit: cover;';  
	}
	#contents2 .con2_box {
    width: 73%!important;
	bottom: 38px;
    right: -8%;   
	top: auto;
    left: auto;
	}
	#contents2 .con2_2 .con2_box{
    width: 73%!important;
	bottom: 38px;
    right: -8%;   
	top: auto;
    left: auto;
	}
	#contents3 .contents_sub_title {
    top: 36px;
    left: 0;
    font-size: 11vw;
}
	#contents3 .contents_title {
    margin-left: 0;
    font-size: 4.5vw;
}
	#contents3 .con3_sub_t {
    font-size: calc(1rem + 3px);
	}
	#contents4 .contents_sub_title {
    left: 5.2%;
}
	#contents4 .contents_sub_title {
    top: 60px;
	}
	#contents4 .contents_title {    
    font-size: 4.5vw;
	}
	#contents5 .contents_title {    
    font-size: 4.5vw;
	}
	#contents5 .contents_sub_title {
    top: 61px;
	}
	#contents5 .con5_box {
    top: 50px;
    left: 0%;
}
.pager li:not(.prev):not(.next){
	display: none;
}
.hvr_trans:hover{
	transform: none
}
#header #logo a{
	background-color: transparent;
}
#header, #header.headtrans{background-color: rgba(255,255,255,0.3)}
	
#main_img{height: 60vw!important}
#main_img .main_txt_wrap{bottom: 10vw}
#intro .fadein{opacity: 1;transform: none}

#footer .map{height: 300px}
.more a .more_bg{top: -60px}
.more a{color: #fff}
	

/* 文字間隔 */
/* default 1px */
.letter_0_tb{letter-spacing: 0;}
.letter_1_tb{letter-spacing: 0.1em;}
.letter_2_tb{letter-spacing: 0.2em;}
.letter_3_tb{letter-spacing: 0.3em;}
.letter_4_tb{letter-spacing: 0.4em;}
.letter_5_tb{letter-spacing: 0.5em;}
.letter_6_tb{letter-spacing: 0.6em;}
.letter_7_tb{letter-spacing: 0.7em;}
.letter_8_tb{letter-spacing: 0.8em;}
.letter_9_tb{letter-spacing: 0.9em;}
.letter_10_tb{letter-spacing: 1em;}

.float_right_tb{
	float: right
}
.float_left_tb{
	float: left
}
.float_clear_tb{
	float: none
}
.clearfix_tb::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
}


/*---------------------------------------------------------------------------*/
@media screen and (max-width: 667px){
html, body{font-size: 14px;}
	
#page_top{
    top: auto;
    right: 0;
    width: auto;
    height: auto;
}
#page_top a{
    width: auto;
    height: auto;
}
	main:before{	
	background-position: 35% 65%;    
}
#main_img .main_txt_wrap{
	bottom: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
	#intro .intro_title {
    margin-top: -22px;
	font-size: 5.5vw;
    letter-spacing: 2px;
    line-height: 1.6;
	}
	#intro .intro_title {
    width: 92%;
}
	.contents_sub_title {
    top: 23px;
    left: 3%;
    font-size: 15vw;
    letter-spacing: 0.5em;
}
	.contents_title {
    font-size: 6.5vw;
}
	#contents1 .con1_bg {
    height: 100%;
	}
	.news .contents_title {
    margin-top: 7.8%;
}
#contents1-2 .con1-2_img img {
    width: 100%;    
    object-fit: contain;
	}
	#contents1-2 .con1-2_img {
    margin-left: 0;
	}
	#contents1 .con1_bg {    
    width: calc(100% - 0px);
    background-position: 62% 0%;
	}
	#contents2 .con2_box,
	#contents2 .con2_2 .con2_box {
    padding:0;
	width: 63%!important;
    bottom: 10px;
    right: 3%;
}
	#contents2 .con2_img img {    
    height: 65vh;
	}
	#contents3 .contents_sub_title {
    top: 7px;
    left: 0;
    font-size: 15vw;
    letter-spacing: 0.3em;
}
#contents3 .contents_title {
    margin-left: 0;
    font-size: 5.5vw;
    letter-spacing: 0.2em;
}
	#contents4 .contents_title {font-size: 6vw;}
	#contents4 .contents_sub_title {left: 3.2%;}
	#contents4 .open_bt, #page06 .open_bt { padding: 5% 3% 5% 50px;}

	#contents5 .contents_title {font-size: 6vw;}
	#contents5 .contents_sub_title {
    top: 21px;
}
	#contents4 .contents_sub_title {
    top: 24px;
}


#footer .grid_6:last-of-type p{
    font-size: 5vw;
    margin-bottom: 0px;
}
#footer .grid_6:last-of-type p a{
   padding: 5px 0;
}



	#page08 .tel_box a{font-size:6vw;}
	.more a { padding: 0.8em 4em;}
#page10 i{top: 18px}

/* 文字間隔 */
/* default 1px */
.letter_0_sp{letter-spacing: 0;}
.letter_1_sp{letter-spacing: 0.1em;}
.letter_2_sp{letter-spacing: 0.2em;}
.letter_3_sp{letter-spacing: 0.3em;}
.letter_4_sp{letter-spacing: 0.4em;}

.letter_5_sp{letter-spacing: 0.5em;}
.letter_6_sp{letter-spacing: 0.6em;}
.letter_7_sp{letter-spacing: 0.7em;}
.letter_8_sp{letter-spacing: 0.8em;}
.letter_9_sp{letter-spacing: 0.9em;}
.letter_10_sp{letter-spacing: 1em;}

.float_right_sp{
	float: right
}
.float_left_sp{
	float: left
}
.float_clear_sp{
	float: none
}
.clearfix_sp::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
}
@media screen and (max-width: 375px){
    	#intro .intro_title {
	font-size: 5.2vw;
	}
	#intro .intro_title {
    width: 96%;
}
}

/*IE*/
@media all and (-ms-high-contrast: none){
.object-fit-image {
  object-fit: none;
  font-family: 'object-fit: none;'
}
.object-fit-image_cover {
  object-fit: none;
  font-family: 'object-fit: none;'
}
}

/*more2 btn*/
.more2_btn {
	font-size: 1.2rem;
	font-weight: 700;    
	position: relative;
	display: inline-block;
	padding: 0.7rem 4rem;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
	color: #212529;
	border-radius: 0.5rem;
}
.more2_btn_wrap {
	display: inline-block;
	padding: 0.105rem;
	border-radius: 0.5rem;
}
.more2_btn_wrap-gold {
  background-image: -webkit-linear-gradient(
    315deg,
    #704308 0%,
    #ffce08 37%,
    #fefeb2 47%,
    #fafad6 50%,
    #fefeb2 53%,
    #e1ce08 63%,
    #704308 100%
  );
  background-image: linear-gradient(
    135deg,
    #704308 0%,
    #ffce08 37%,
    #fefeb2 47%,
    #fafad6 50%,
    #fefeb2 53%,
    #e1ce08 63%,
    #704308 100%
  );
}

.more2_btn_wrap-gold:hover{
  text-shadow: 0 0 15px rgba(250, 250, 214, 0.5),
    0 0 15px rgba(250, 250, 214, 0.5), 0 0 15px rgba(250, 250, 214, 0.5),
    0 0 15px rgba(250, 250, 214, 0.5);
}

a.btn_grad {  
  background: #000;
}

.btn_grad-gold {
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    from(#ffffdb),
    to(#a16422)
  );
  background: -webkit-linear-gradient(bottom, #ffffdb, #a16422);
  background: linear-gradient(to top, #ffffdb, #a16422);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

