@charset "UTF-8";
/* CSS Document */

/*MAIN*/
#topContent{ background-color: #000; background-image: url("../../img/main_img_nagoya_pc.jpg"); background-position: center; background-size: 1900px; background-repeat: no-repeat;}
#mainVisual { width: 100%; max-width: 1200px; margin: 0 auto; padding-top: 700px;}
.mv_caption{ width: calc( 100% - 20px); max-width: 1200px; margin: 0 auto 0;}

.leadTxt{ background-color: #000; padding: 10px 0 0; margin: 0 auto 30px; color: #fff;}
.leadTxt:after{ content: ''; width: 100%; height: 100px; display: block; background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,1) 20%, rgba(0,0,0,1) 100%);}
.leadTxt .inner{width: calc( 100% - 40px); max-width: 1000px; margin: 80px auto 30px;}
.leadTxt .inner .title{ text-align: center; color: #fef35f; margin-bottom: 30px; line-height: 1.4;}
.leadTxt .inner .title p:first-child{ font-size: 5.5rem; margin-bottom: 0.3em;}
.leadTxt .inner .title p{ font-size: 4rem;}
.leadTxt .inner p.txt{ font-size: 1.8rem; font-family: 'Noto Sans JP', sans-serif; font-weight: 700; font-style: normal;}
.leadTxt .inner .flexBox{ justify-content: space-between;}
.leadTxt .inner .flexBox .txt{ width: calc( 100% - 330px);}
.leadTxt .inner .flexBox .img{ width: 300px;}
.leadTxt .inner .flexBox .img .caption12{ margin-top: 10px;}

/* INFORMATION */
#information{ background-color: #fff; background-image: url("../../img/news_bg.png"); background-repeat: no-repeat; background-size: 306px; background-position: 0% 0%; /*padding-top: 30px;*/ margin-bottom: 60px;}
#information .commonContent{  }
#information .inner{/*min-height: 270px;*/ align-items:/*center*/ flex-start; flex-wrap: wrap; flex-direction: row; padding: 0 0 40px; }
#information .news{ width: 100%; background-color:hsla(51,73%,66%,0.3); padding: 30px 20px 20px;}
#information .fb{ width: 48%; background-color:hsla(51,73%,66%,0.3); padding: 30px 20px 20px;}
#information .tw{ width: 48%; background-color:hsla(51,73%,66%,0.3); padding: 30px 20px 20px;}
#information .insta{ width: 48%; background-color:hsla(51,73%,66%,0.3); padding: 30px 20px 20px;}
#information h3{ font-family: 'Noto Sans JP', sans-serif; font-weight: 900; padding: 0 0 0 0; width:180px; text-align: center; box-sizing: border-box; letter-spacing: 0.1em; line-height: 1;}
#information .inner h3{ width:100%;}
#information h3 span{display: inline-block;}
#information h3 .en{ font-size: 3.7rem; margin-bottom: 10px;}
#information h3 .ja{ font-size: 1.4rem;}
#information #infoBox { width:calc( 100% - 180px); /*100%;*/ margin: 0; box-sizing: border-box; }
#information #infoBox ul {width: 100%; max-height: 270px; overflow:auto;}
#information #infoBox ul li { margin:0 auto 10px auto; width: 100%; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; }
#information #infoBox ul li time { font-family: 'Noto Sans JP', sans-serif; font-weight: 900; color:#94693c; margin:0; font-size: 2rem; width: 7em; margin-right: 0.5em; margin-top: -0.5rem;  }
#information #infoBox ul li .txt{ width: calc( 100% - 10em) /*100%*/;}
#information #infoBox ul li a { text-decoration:none; }
#information #infoBox ul li a:hover { text-decoration:underline; }
#information .tw_con{ width: 100%; height: 492px; overflow:auto; margin: 20px 0 0;}
#information .fb_con{ width: 100%; height: 300px; overflow:hidden; margin: 20px 0 0;}
#information .insta_con{ width: 100%; height: 492px; overflow:auto; margin: 20px 0 0; }
/*#information .insta_con iframe{ position: absolute; top: 0; left: 0;}*/

/*facebook　埋め込み調整*/
	.fb-page,
	.fb-page span,
	.facebook_wrap iframe{
	  width: 100% !important;
	  height: 300px !important;
	}

.btnArea{ margin: 60px auto 60px; width: 595px; max-width: 70%; text-align: left; box-sizing: border-box;  position: relative; padding: 0 20px;}
.btnArea > a{font-family: 'Noto Sans JP', sans-serif; font-weight: 900; width: 100%; box-sizing: border-box; padding: 1.5em 50px 1.5em 1.5em; background-color: #006db0; border-radius: 10px; color: #fff; display: inline-block; z-index: 9; position: relative; line-height: 1.5; text-decoration: none !important; cursor:default; }
.btnArea > a i{ margin: 0 0 0 0.2em;}
.btnArea > a:hover{ text-decoration: none; background-color: #004C7A; opacity: 1 !important; }
.btnArea > a span{ display: inline-block; font-size: 150%; margin-bottom: 5px; color: #fed900;}
.btnArea > a span.big{font-size: 245%; line-height: 1; margin-bottom: 10px; text-shadow: 3px 3px 0 #000;  }
.btnArea > a span.big span.small{ font-size: 70%;}
.btnArea > a:after{font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0a9"; position: absolute; right: 20px; top: 50%; font-size: 30px; transform: translateY(-50%);}

.endTxt{ /*display: none;*/ margin: 60px auto 60px; width: 1000px; max-width: calc(100% - 40px); text-align: center; box-sizing: border-box; padding: 20px; font-family: 'Noto Sans JP', sans-serif; font-weight: 900; border:3px solid #c00; background-color: #fff; border-radius: 9px;}
.endTxt p.title{ font-size:2.4rem; margin-bottom: 30px; color: #c00;}
.endTxt p{ font-size:2rem; color: #333; }
/*.endTxt p span{position: relative; padding: 0 30px; display: inline-block;}
.endTxt p span:before,.endTxt p span:after{content: ''; position: absolute; top: 50%; display: inline-block; width: 30px; height: 2px; background-color: #333; -moz-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg);}
.endTxt p span:before {left:0;-moz-transform: rotate(60deg); -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg);}
.endTxt p span:after {right: 0;}*/

/*top_highlight*/
#top_highlight{ background-color: #fef35f; padding: 80px 50px 50px 50px; font-weight: bold; color: #000;}
#top_highlight .commonContent{ position: relative; background-color:#f18b07; border: 10px solid #fff; margin: 0 auto 70px; padding: 30px; padding-bottom: 40px;}
#top_highlight .tit_txt{ font-family: 'Noto Sans JP', sans-serif; font-weight: 900; color: #fff; font-size: 3rem; line-height: 1.5; margin-bottom: 20px}
#top_highlight h3{ margin: -70px 0 30px -30px; width: 100%;}
#top_highlight .tit span{ display: inline-block;}
#top_highlight .imgArea .img_txt{ font-size: 1.3rem; margin-top: 10px;}
#top_highlight .flexBox{ justify-content: space-between;}
#top_highlight .flexBox .txt{ width: 51%;}
#top_highlight .flexBox .imgArea{ width: 44%;}

#top_highlight01 .flexBox{ align-items: center;}
#top_highlight01 .imgArea .img_txt{ text-align: right;}

#top_highlight02 h3{ margin: -70px 0px 30px auto; text-align: right; transform: translateX(30px);}
#top_highlight02 .flexBox{ flex-direction: row-reverse;}
#top_highlight02 .txt{ width: 55%;}
#top_highlight02 .imgArea{ width: 38%; margin-top: -10%;}
#top_highlight03 .commonContent{ margin-bottom: 0;}
#top_highlight03 .flexBox .txt{ width: 58%;}
#top_highlight03 .flexBox .imgArea{ width: 35%; }
#top_highlight03 .imgArea .img_txt{ text-align: right;}

/*download*/
.pdf_download{ max-width: 90%; width: 600px; text-align: center; margin: 60px auto 20px;}
.pdf_download a{ background-color: #006db0; display: block; font-size: 2.4rem; padding: 1em; border-radius: 45px; line-height: 1.4; color: #fff; font-family: 'Noto Sans JP', sans-serif; font-weight: 900; }
.pdf_download a i{ margin: 0 0 0 0.3em; }
.pdf_download a:hover{ text-decoration: none; background-color: #666; color: #fff; }
.pdf_download a span{ display: inline-block; margin: 0 10px;}
.pdf_download a span.small{ font-size: 80%; margin: 0;}

#cm{ margin: 0 auto 60px; /*display: none;*/}
.youtube { width: 100%; aspect-ratio: 16 / 9; }
.youtube iframe { width: 100%; height: 100%;}
.mov{ width: 800px; max-width: 98%; margin: 0 auto;}
#cm .commonContent{ width: 800px; }
#cm .commonContent .youtube{ position: relative;}
#cm .commonContent .youtube a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: hsla(0,0%,0%,0.00); background-color: hsla(0,0%,0%,0.00); }
#cm .commonContent .youtube a:hover{background-color: hsla(0,0%,0%,0.4);}

#photoGallery{ background-color: #f3d8b6; padding: 60px 0;}
#photoGallery h3{ font-family: 'Noto Sans JP', sans-serif; font-weight: 900; padding: 0; width:100%; text-align: center; box-sizing: border-box; letter-spacing: 0.1em; line-height: 1; margin-bottom: 60px;}
#photoGallery .en{ font-size: 3.7rem;}
.slick_gallery{ max-width: 760px; width: 100%; margin: 0 auto 20px;}
.slick_gallery p.caption{ font-size: 1.4rem; margin-top: 10px; }
.slick_gallery_thumbnail{ max-width: 770px; width: 100%; margin: 0 auto;}
.slick_gallery_thumbnail li{ margin: 0 5px;}
.slick_gallery_thumbnail .slick-slide{ background-color: #000;}
.slick_gallery_thumbnail .slick-slide img{ opacity: 0.5;}
.slick_gallery_thumbnail .slick-slide.slick-current img{ opacity: 1;}
.slick_gallery_thumbnail .slick-slide:hover img{opacity: 1;}
.slick_gallery .slick-prev:before,
.slick_gallery .slick-next:before{ font-size: 4rem; color: #fff;}
.slick_gallery .slick-prev,
.slick_gallery .slick-next{ width: 40px; height: 40px; transform: translate(0, -20px)}

@media screen and (max-width:1200px) {
#topContent{ background-size: 160%;}
#mainVisual {padding-top: 58.3%;}
}

@media screen and (max-width:900px) {
.leadTxt .inner{margin: 60px auto 0;}
.leadTxt .inner .title p:first-child{ font-size: 4.5rem; }
.leadTxt .inner .title p{ font-size: 3rem;}
.leadTxt .inner p.txt{ font-size: 1.6rem; }
	
#top_highlight .flexBox .txt{ width: 100%; margin-bottom: 20px;}
#top_highlight .flexBox .imgArea{ width: 100%; text-align: center;}
#top_highlight01 .flexBox .imgArea{ margin: 0 auto ; max-width: 80%; }
#top_highlight02 .flexBox .imgArea{ margin: 0 auto ; max-width: 80%; }
#top_highlight03 .flexBox .imgArea{ margin: 0 auto ; max-width: 100%; }
#top_highlight03 .flexBox .imgArea img{max-width: 70%;}
}

@media screen and (max-width:780px) {
#topContent{background-image: url("../../img/main_img_nagoya_sp.jpg"); background-position: center; background-size: 100%; padding-top: 132%;}
#mainVisual{ padding-top: 0;}
#mainVisual #titArea{ display: none;}
	
.leadTxt .inner .flexBox .txt{ width: 60%;}
.leadTxt .inner .flexBox .img{ width: calc( 40% - 20px);}

/*メインビジュアルスライド*/
/*#mainVisual_renewal{ width: 100%; position: relative; padding-top: 131vw;}
#mainVisualSlide_pc{ display: none;}
#mainVisualSlide_sp{ display: block;}
#mainVisualSlide_sp .main{background-image: url("../../img/main_img_sp.jpg"); background-position: center; background-size: cover; padding-top: 131vw;}
#mainVisualSlide_sp li{ width: 100%; height: 0; padding-top: 131vw; }
#mainVisualSlide_sp li.visual .inner{ left:auto !important; right: 15px !important; top: auto; bottom: 15px !important; width: calc( 100% - 30px);}
#mainVisualSlide_sp li.visual .inner .titArea{ max-width: 505px; margin: 0 auto; padding: 0; width: 100%; text-align: center;}
#mainVisualSlide_sp li#visual01_sp{ background-image: url("../../img/mv_img_sp01.jpg");}
#mainVisualSlide_sp li#visual02_sp{ background-image: url("../../img/mv_img_sp02.jpg");}
#mainVisualSlide_sp li#visual02_sp.visual .inner{ top: 10px !important; bottom: auto !important; }
#mainVisualSlide_sp li#visual03_sp{ background-image: url("../../img/mv_img_sp03.jpg");}
#mainVisualSlide_sp li#visual04_sp{ background-image: url("../../img/mv_img_sp04.jpg");}
#mainVisualSlide_sp li#visual05_sp{ background-image: url("../../img/mv_img_sp05.jpg");}
#mainVisualSlide_sp li#visual05_sp.visual .inner{ top: 10px !important; bottom: auto !important; }
#mainVisualSlide_sp li#visual06_sp{ background-image: url("../../img/mv_img_sp06.jpg");}
#mainVisualSlide_sp li#visual06_sp.visual .inner{ top: 10px !important; bottom: auto !important; }*/

#information{ background-size: 40%;}
#information #infoBox ul li time { width: 100%; }
#information #infoBox ul li .txt{ width: 100%;}

.btnArea{ width: 100%; max-width: 80%; margin: 50px auto;}
.btnArea a span.big{font-size: 5.3vw; }
.btnArea a span{font-size: 3vw;}

.endTxt p.title{ font-size:2.2rem; line-height: 1.6;}
.endTxt p{ font-size:1.6rem; line-height: 1.6;}
	
#top_highlight{ padding: 60px 20px 50px 20px; font-weight: bold; color: #000;}
#top_highlight h3{ margin-top: -12%;}
#top_highlight h3 img{ max-width: 65%;}

}

@media screen and (max-width:640px) {
.leadTxt .inner .flexBox .txt{ width: 100%;}
.leadTxt .inner .flexBox .img{ width: fit-content; max-width: 100%; margin: 20px auto 0;}
	
#information h3{ width:100%; }
#information #infoBox { width:100%; margin:20px 0 0; }
#information .news{ width: 100%; margin-bottom: 0;}
#information .fb{ width: 100%; margin-bottom: 40px; }
#information .fb .fb_con{ display: flex; justify-content: center;}
#information .tw{ width: 100%; }
#information .insta{ width: 100%; margin-bottom: 40px; }
	
#top_highlight .commonContent{ border: 5px solid #fff; padding: 20px; padding-bottom: 40px;}
#top_highlight h3{ margin-left: -20px;}
#top_highlight02 h3{ margin-left: auto; transform: translateX(20px); }

#top_highlight .tit_txt{ font-size: 2.4rem; line-height: 1.5; margin-bottom: 20px}
	
.pdf_download a{font-size: 2rem;  }

}

@media screen and (max-width:480px) {
.leadTxt .inner{margin: 50px auto 0;}
.leadTxt .inner .title p:first-child{ font-size: 8vw; }
.leadTxt .inner .title p{ font-size: 6.8vw;}
.leadTxt .inner p.txt{ font-size: 1.5rem; }
	
#information{ background-size: 52%; padding: 30px 0}
#information h3{ width: 100%; margin-bottom: 20px; font-size: 2.4rem;}
#information h3 .en{font-size: 2.4rem;}
#information #infoBox { width:100%; padding: 0; max-height:300px; height: auto;}
#information #infoBox ul li { border-bottom: 1px solid #ccc; padding-bottom: 10px;}

.btnArea{ width: 100%; max-width: 100%; margin: 50px auto;}
.btnArea > a span.big{font-size: 6.4vw; line-height: 1; margin-bottom: 10px }
.btnArea > a span{font-size: 4.8vw; margin-bottom: 10px; line-height: 1;}
.btnArea > a{padding: 1.5em 30px 1.5em 1.5em;}

#photoGallery h3{ margin-bottom: 30px; font-size: 2.4rem;}
#photoGallery h3 .en{font-size: 2.4rem;}

.endTxt{ margin: 60px auto 40px;}
.endTxt p.title{ font-size:4.5vw; }

}