﻿
/* all ---------------------------------------------------------------------------------------------*/
#loader::after{
	background: #e6ffff!important;
	background: -webkit-linear-gradient(left, #cdd9f9 0%,#c2fafb 100%)!important;
	background: linear-gradient(to right, #cdd9f9 0%,#c2fafb 100%)!important;
}
h1::after{border-width: 150px 220px 0 0;}
.line_bnr.f_bnr{
	width: 70%;
    max-width: 1000px;
    padding-bottom: 100px;
}
#menu_bt{opacity: 1!important;background-color: #1A2851;z-index: 99;}
#wrap{overflow: hidden}
.sns_header.sns_links{position: fixed;top: 100px;right: 0;z-index: 98}
.sns_header.sns_links ul{display: block;}
.sns_header.sns_links li {margin-right: 0;margin-bottom: 10px;}
.sns_intro.sns_links {padding-bottom: 0;}
.sns_intro.sns_links li:last-of-type {margin-right: 20px;}


/* top ---------------------------------------------------------------------------------------------*/
#main_img,body {overflow: hidden;}
#main_img .main_txt {
    width: 44%;
    max-width: 1200px;
    right: 86px;
    top: 49%;
    transform: translateY(-50%);
    z-index: 3;
}
#main_img .main_txt img{opacity: 0}
#main_img.active .txt01, #main_img.active .txt03{animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;}
#main_img.active .txt02{animation: poyoyon2 1s ease-in-out forwards;}

#main_img.active .txt02{animation-delay: .6s}
#main_img.active .txt03{animation-delay: 1.5s}

@keyframes zoomIn {
	0% {transform: scale(0.8);opacity: 0;}
	100% {opacity: 1;transform: scale(1)}
}
@keyframes poyoyon2 {
	0%  {opacity: 0;transform: scale(1.0, 1.0) translate(0, 0);}
	15% {opacity: 1;transform: scale(0.98, 0.9) translate(0, 5px);}
	30% {opacity: 1;transform: scale(1.02, 1.0) translate(0, 8px);}
	50% {opacity: 1;transform: scale(0.98, 1.05) translate(0, -8px);}
	70% {opacity: 1;transform: scale(1.0, 0.9) translate(0, 5px);}
	100% {opacity: 1;transform: scale(1.0, 1.0) translate(0, 0);}
}

main.top{
	background-image: url(./Dup/img/bg02.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 39%;
    background-attachment: fixed;
}
.intro_bg {
    background-image: url(./Dup/img/bg01.png),url(./Dup/img/bg03.png),url(./Dup/img/bg04.png),url(./Dup/img/bg02.png);
    background-repeat: no-repeat;
    background-position: left 18% top 0, left bottom, left 4% top 41%, right center;
    background-size: 451px, 500px, 245px, 39%;
    background-attachment: scroll, scroll, scroll, fixed;
}
.intro_txt_wrap {
    padding-bottom: 150px;
}
.intro_txt_wrap .width_1280-max{
	max-width: 1000px;
	width: 90%;
	margin-bottom: 50px;
}
#intro .line_bnr{
	width: 90%;
	margin-top: -35px;
}
#intro h3.en_font, #contents_links h3{
	font-size: 48px;
	padding-top: 80px;
}
#intro.on #intro_box #intro_txt{padding-right: 90px;}
#intro #intro_box #intro_txt h3::after{content: "ABOUT US"!important;}

#contents_links h3 {
    position: relative;
    line-height: 1;
    padding-top: 93px;
}
#contents_links h3::before {
    content: '';
    display: inline-block;
    width: 102px;
    height: 108px;
    background-image: url(../dup/img/item01.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -29px;
}
#contents h3{margin-bottom: 100px;}
#contents div {
    width: 70%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: 60px;
}
#contents div:first-of-type{margin-bottom: 50px;}
#top_cms .top_cms_box .top_cms_title p{opacity: 0.09;font-size: 62px;}


/* cms ---------------------------------------------------------------------------------------------*/
#cms_3-a .cate:last-of-type{margin-bottom: 30px;}



/* IE */
@media all and (-ms-high-contrast: none){
main.top{background-image: none;}
.intro_bg {background-attachment: scroll, scroll, scroll, scroll;}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.sns_header.sns_links{right: 83px;top: 21px;}
.sns_header.sns_links ul{display: flex;}
.sns_header.sns_links li{margin-right: 16px;margin-bottom: 0}
	
h1::after{border-width: 110px 200px 0 0;}
#main_img .main_txt {
    width: 70%;
    right: 5px;
    top: 74%;
}
#main_img .main_txt:nth-of-type(1){top: 71%;}
#main_img .main_txt:nth-of-type(2){top: 72%;}
#main_img .main_txt:nth-of-type(2){top: 73%;width: 73%;}
main.top{background: #fff;}
.intro_bg {
    background-position: left 3% top 0, left bottom, left -10% top 41%, right center;
    background-size: 38%, 40%, 32%, 56%;
	background-attachment: scroll;
}
#intro h3 {font-size: 25px;}
#intro p {width: 90%!important;}
#intro #intro_box #intro_txt h3::after {font-size: 48px;transform: translateY(-46%);}
#contents div h4{font-size: 26px;}
#contents div {
    width: 86%;
    max-width: 100%;
    margin-left: auto;
    margin-right: 4%;
}
.line_bnr.f_bnr {width: 90%;}
#page08 .line_bnr.f_bnr {width: 100%;margin-top: -28px;}
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
#menu_wrap{padding-top: 25px;}
.font_14_tb {xcfont-size: 13px;}
h1::after {border-width: 82px 105px 0 0;}
h1 img{width: 71px}
#main_img .main_txt{top: 59%;width: 68%;right: 10px;}
#main_img .main_txt:nth-of-type(2) {top: 59%;width: 64%;right: -1px;}
#main_img .main_txt:nth-of-type(3) {top: 61%}

.intro_txt_wrap{padding-bottom: 50px;}
.intro_bg {
    background-image: url(./Dup/img/bg01.png),url(./Dup/img/bg03.png),url(./Dup/img/bg04.png);
    background-position: left -34% top 0, left bottom, right -27% top 32%;
    background-size: 54%, 45%, 44%;
    background-attachment: scroll;
}
#intro h3.en_font, #contents_links h3 {
    font-size: 37px;
    line-height: 1.3;
    padding-top: 54px;
}
#intro h3 {
    padding-top: 14px;
    font-size: 20px;
}
#intro p{font-size: 14px;padding-top: 40px;}
#intro #intro_box #intro_txt h3::after {font-size: 42px;transform: translateY(-20%);}
#intro #intro_box #intro_txt h3 span{font-size: 19px;}
#intro.on #intro_box #intro_txt{padding-right: 0;}
	
#contents_links h3{padding-bottom: 30px;}
#contents_links h3::before {
    width: 103px;
    height: 98px;
    top: -55px;
}
#contents div {width: 90%;margin-right: 5%;}
#contents h3{margin-bottom: 50px;padding-left: 18px;line-height: 1.2;font-size: 36px;}
#contents div h4{font-size: 20px;}
	
#intro .line_bnr {width: 100%;margin-top: -7px;}
.line_bnr.f_bnr{width: 87%;padding-bottom: 70px;}
#page08 .line_bnr.f_bnr {padding-bottom: 26px;margin-top: -50px;}
	
#top_cms .top_cms_box .top_cms_title h3{font-size: 22px;}
#top_cms .top_cms_box .top_cms_title p{font-size: 38px;}
#footer_box{padding-left: 20px!important;padding-right: 20px!important;}

#cms_1-a .pager li {margin-right: 0;}
	
/* sublimeSlideshow　高さ変更  */
#main_img{padding-top: 0;}
#container {
	width: 100%;
	height: 300px;
	overflow: hidden;
}
#container ul.sm-slider {
	position: relative;
}
#container_f{
	position: absolute;
	z-index: -1;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100vh;
}
.sm-slider::before, .sm-slider::after, .sm-slider, .sm-slider::before, .sm-slider::after{height: 300px!important;}
.sm-slider, .sm-slider::before, .sm-slider::after{position: absolute!important}
#container_f .sm-slider::before, #container_f .sm-slider::after, #container_f .sm-slider, #container_f .sm-slider::before, #container_f .sm-slider::after{height: 100vh!important;}
}




/* 2021.10.04 */
#loader{display: none;}
#fade {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999;
}

#contents{margin-bottom: 250px}
#contents2 .con2_wrap {
    background: linear-gradient( -45deg, rgba(216,233,234,0.53) 25%, rgba(216,233,234,0.52) 25%, rgba(216,233,234,0.52) 50%, rgba(216,233,234,0.53) 50%, rgba(216,233,234,0.53) 75%, rgba(216,233,234,0.36) 75%, rgba(216,233,234,0.36) );
    background-size: 30px 30px;
    padding-bottom: 77px;
}
#contents2 .title_wrap{
	transform: translateY(-172px);
}
#contents2 .con2_title3{
	width: 17%;
    right: 4%;
	top: 30px;
}
#contents2 .con2_title4{margin-top: 25px;}

#contents2 .box_wrap{
	margin-top: -120px;
}


@media screen and (max-width: 768px){
#contents2 .con2_wrap{
	padding-bottom: 54px;
}
#contents2 .con2_title3 {
    width: 20%;
    right: 2%;
    top: 35px;
}
#contents2 .box_wrap {
    margin-top: -154px;
}
#contents2 .box_wrap .box{
	margin-bottom: 72px;
}
}

@media screen and (max-width: 667px){
#page_top{
	height: 40px;
}
#contents {
    margin-bottom: 193px;
}
#contents2 .con2_wrap {
	padding-bottom: 120px;
}
#contents2 .con2_wrap {
    padding-bottom: 27px;
}
#contents2 .title_wrap {
    transform: translateY(-137px);
}
#contents2 .con2_title3 {
	width: 80%;
    margin: auto;
}
#contents2 .con2_title4{
	max-width: 18%
}
#contents2 .box_wrap {
    margin-top: -105px;
	width: 95%!important;
}
}


/* 2021.11.17 */
h1 img {width: 298px!important;}
h1.main_txt{padding: 0!important;}
h1.main_txt img{width: 100%!important}
h1.main_txt::after{display: none;}

@media screen and (max-width: 667px){
h1 img {width: 197px!important;}
#main_img .main_txt:nth-of-type(1){top: 60%}
}


/* 2021.12.13 */
#contents_links .box_wrap .box a{padding: 50px 15px 30px}
#contents_links .box_wrap .box a h4{padding: 10px 10px;font-size: 17px;}

