@charset "utf-8";

@-webkit-keyframes ds-index-img-scale {100% {transform:scale(1.1,1.1);}}
@-moz-keyframes ds-index-img-scale {100% {transform:scale(1.1,1.1);}}
@keyframes ds-index-img-scale {100% {transform:scale(1.1,1.1);}}

.ds-img-scale {overflow:hidden;}
.ds-img-scale img {
	-webkit-animation: ds-index-img-scale 20s 1s infinite ease alternate;
	-moz-animation: ds-index-img-scale 20s 1s infinite ease alternate;
	animation: ds-index-img-scale 20s 1s infinite ease alternate;
}

/* SWIPER SETTING*/
.swiper-slide-active *[class*="ds-swiper-prx"] {opacity:1!important; transform:translate(0, 0) scale(1, 1)!important; transition-property:opacity, transform!important; transition-timing-function: ease-out;
}
 *[class*="ds-swiper-prx"] {opacity:0; transition-duration:1s; transform:translate(0,100%);}
 .ds-swiper-prx-1 {transition-delay:0.5s;} .ds-swiper-prx-2 {transition-delay:1.0s;} .ds-swiper-prx-3 {transition-delay:1.5s;} .ds-swiper-prx-4 {transition-delay:2.0s;} .ds-swiper-prx-5 {transition-delay:2.5s;} .ds-swiper-prx-6 {transition-delay:3.0s;} .ds-swiper-prx-7 {transition-delay:3.5s;} .ds-swiper-prx-8 {transition-delay:4.0s;} .ds-swiper-prx-9 {transition-delay:4.5s;} .ds-swiper-prx-10 {transition-delay:5.0s;} .ds-swiper-prx-11 {transition-delay:5.5s;} .ds-swiper-prx-12 {transition-delay:6.0s;} .ds-swiper-prx-13 {transition-delay:6.5s;} .ds-swiper-prx-14 {transition-delay:7.0s;} .ds-swiper-prx-15 {transition-delay:7.5s;}
 
.ds-index-ban {position:relative; max-width:1920px; margin:0 auto;}
.ds-index-ban-size>div {position:relative; height:0; padding-bottom:40%; z-index:0;}

.ds-index-ban>ul {position:absolute; width:100%; height:100%; top:0; left:0;}

.ds-index-ban-slide-bg {position:absolute; width:100%; height:100%; top:0; left:0;}
.ds-index-ban-slide-bg>div {height:100%; margin:0 auto; font-size:0;}
.ds-index-ban-slide-bg img {object-fit:cover; width:100%; height:100%; transition:transform 0.5s;}

/* SWIPER MAIN*/
.ds-index-ban-slide-main {position:relative; height:100%; box-sizing:border-box; display:flex; align-items:stretch; height:100%; margin:0 auto;}

.ds-index-ban-slide-main>* {background:#fff; height:100%; box-sizing:border-box; padding:1em 5%; font-size:3.7rem; display:flex; flex-direction:column; justify-content:space-evenly; align-items:flex-start; transition:all 0.5s;}
.ds-index-ban-slide-main:after{content:""; height:100%; width:10%; display:block; background:linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));}
.ds-index-ban-slide-main>* * {word-break:keep-all; display:block;}
.ds-index-ban-slide-main>a:hover {font-weight:inherit; background:rgba(255,255,255,1); padding-left:5.3%;}

.ds-index-ban-slide-main-btn {font-size:0.5em; padding:0.3em 1em; background:#222; color:#fff; border-radius:20px;}
.ds-index-ban-slide-main-txt small {font-size:0.6em;}
.ds-index-ban-slide-main-txt strong {line-height:1.5;}
.ds-index-ban-slide-main-btn:last-of-type {background:#f48641;}

.ds-index-ban-slide-main>a:hover>span {color:#fff; font-weight:bold;}
.ds-index-ban *[class*=ds-swiper-prx] {transform:translate(-20%,0); display:block;}
.ds-index-ban .ds-swiper-prx-1 {transition-delay:0.0s;}
.ds-index-ban .ds-swiper-prx-2 {transition-delay:0.2s;}
.ds-index-ban .ds-swiper-prx-3 {transition-delay:0.4s;}
.ds-index-ban .ds-swiper-prx-4 {transition-delay:0.6s;}
.ds-index-ban .ds-swiper-prx-5 {transition-delay:0.8s;}
.ds-index-ban .ds-swiper-prx-4:last-of-type {transition-delay:0.8s;}
.ds-index-ban .ds-swiper-prx-5:last-of-type {transition-delay:1.0s;}
.ds-index-ban .ds-swiper-prx-6:last-of-type {transition-delay:1.2s;}


/* INDEX CONTENT */

.ds-index-list-item>a {display:block; box-shadow:3px 3px 10px -5px #000;}
.ds-index-list-item>a:hover {font-weight:inherit;}
.ds-index-list-img {position:relative; overflow:hidden; height:0;}
.ds-index-list-img>div {position:absolute; width:100%; height:100%; top:0; left:0;}
.ds-index-list-img img {object-fit:cover; width:100%; height:100%; transition:transform 0.5s; display:block;}

.ds-index-list-item>a:hover .ds-index-list-img img {transform:scale(1.02,1.02);}

.ds-index-content>div { overflow:hidden;}

.ds-index-title {padding:6% 0; display:flex; justify-content:center; align-items:center;}
.ds-index-title h2 {font-size:3rem; border-style:solid; border-width:0 0 4px 0; margin:0; line-height:1; padding:0 0 0.7em 0;}

.ds-index-title-white {color:#fff;}
.ds-index-title-white h2 {border-color:#fff;}

.ds-index-title-black {color:#333;}
.ds-index-title-black h2 {border-color:#406392;}
.ds-index-content>div>*:last-child {margin-bottom:8%;}
.ds-index-B>div>*:first-child {margin-top:8%;}


/* INDEX A */
.ds-index-A {background:#406392}
.ds-index-A>div>ul {display:flex; flex-wrap:wrap; align-items:stretch; justify-content:space-between; gap:20px 0;}

.ds-index-A-item {flex:0 0 32.5%;}
.ds-index-A-item:nth-of-type(6)~li {flex:0 0 49.2%!important;}
.ds-index-A-item>a {background:#fff; height:100%;}
.ds-index-A-item>a:hover {background:#fafafa; transform:translate(0, -10px);}

.ds-index-A-img {padding-bottom:60%;}
.ds-index-A-item:nth-of-type(6)~li .ds-index-A-img {padding-bottom:40%;}

.ds-index-A-txt {box-sizing:border-box; font-size:1.7rem; padding:1.5em 1.5em 2.5em 1.5em;}
.ds-index-A-txt>* {display:block;}
.ds-index-A-txt>strong {font-size:1.2em; line-height:1.5; word-break:keep-all;}
.ds-index-A-txt>small {margin:0.5em 0 1em 0; line-height:1.5; word-break:keep-all;}
.ds-index-A-txt>div p {
	width:100%;
	margin:0;
	 text-overflow: ellipsis;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

/* INDEX B */
.ds-index-B {background:#398085}

.ds-index-B>div>ul>li~li {margin-top:20px;}
.ds-index-B-item>a {background:#fff; display:flex; align-items:stretch;}
.ds-index-B-item>a:hover {transform:translate(10px,0);}
.ds-index-B-item:nth-of-type(2n)>a {flex-direction:row-reverse;}
.ds-index-B-item>a>div {flex:0 0 50%;}
.ds-index-B-img {padding-bottom:20%;}
.ds-index-B-img>div {position:absolute; width:100%; height:100%; top:0; left:0;}

.ds-index-B-txt {line-height:1.5; display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:0.5em; text-align:center; font-size:2rem; box-sizing:border-box; padding:2em;}
.ds-index-B-txt span:first-child {line-height:1; padding:0 1.5em; border-width:0 3px; border-color:steelblue; border-style:solid;}
.ds-index-B-txt div * {display:block;}
.ds-index-B-txt small {font-weight:normal;}
.ds-index-B-txt strong {font-weight:normal; font-size:1.6em;}
.ds-index-B-txt span:last-child {display:block;font-size:0.9em; line-height:1; padding:1em 2em; background:#f48641; border-radius:1em; color:#eaeaea;}
.ds-index-B-item:hover .ds-index-B-txt span:last-child {color:#fff; font-weight:bold;}

/* INDEX C */
.ds-index-C {background:#f48641}
.ds-index-C>div>ul {display:flex; justify-content:space-between;}
.ds-index-C>div>ul>li {flex:0 0 49%;}
.ds-index-C>div>ul>li:nth-of-type(1) {transition-delay:0.2s;}
.ds-index-C>div>ul>li:nth-of-type(3) {transition-delay:0.4s;}
.ds-index-C-item>a {background:#fff;}
.ds-index-C-item>a:hover {transform:translate(0,-10px);}
.ds-index-C-img {padding-bottom:40%;}
.ds-index-C-img>div {position:absolute; width:100%; height:100%; top:0; left:0;}

/* INDEX D */
.ds-index-D .ds-index-title {color:#333;}
.ds-index-D>div>ul {display:flex; justify-content:space-between; align-items:stretch; font-size:1.9rem; margin-bottom:8%;}
.ds-index-D-item {flex:0 0 23%;}
.ds-index-D-item>a {background:#fff; text-align:center; border-radius:1em; position:relative; height:0%; padding-bottom:55%;}
.ds-index-D-item>a:hover {transform:translate(0,-8px); color:#406392}
.ds-index-D-item:nth-of-type(3)>a:hover i{color:red}
.ds-index-D-item>a>div {position:absolute; top:0; left:0; width:100%; height:100%; line-height:1; display:flex; flex-direction:column; justify-content:space-evenly; align-items:center;}
.ds-index-D-icon {display:block; font-size:3em;}
.ds-index-D-txt {white-space:nowrap; font-size:1em;}
.ds-index-D-item>a .ds-index-D-txt {font-weight:bold;}


@media all and (max-width:1401px) and (min-width:1025px) { /* TABLET */
	.ds-index-ban-size>div {position:relative; height:0; padding-bottom:45%; z-index:0;}
	
	.ds-index-ban-slide-main>* {font-size:3.3rem; padding-left:6%; background:rgba(255,255,255,0.9);}
	.ds-index-ban-slide-main:after {width:7%; background:linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0));}
	.ds-index-ban-slide-main-btn {font-size:0.5em; padding-top:0.3em;}
	.ds-index-ban-slide-main>a:hover {padding-left:6%;}
	
	.ds-index-title h2 {font-size:2.7rem; border-bottom-width:3px;}
	
	.ds-index-A-img {padding-bottom:55%;}
	
	.ds-index-A-txt {font-size:1.6rem; padding:1.2em 1.2em 2.2em 1.2em;}
	
	.ds-index-B-img {height:initial; padding-bottom:0;}
	.ds-index-B-txt {font-size:1.6rem; padding:1.4em;}
	.ds-index-B-txt span:first-child {padding:0 0.8em; border-width:0 2px;}
	.ds-index-B-txt strong {font-size:1.4em;}
	.ds-index-B-txt span:last-child {padding:0.6em 1.6em;}
	
	.ds-index-D>div>ul {font-size:1.8rem; margin-bottom:7%;}
	.ds-index-D-icon {font-size:2.4em;}
	.ds-index-D-txt {font-size:1em;}
}

@media all and (max-width:1024px) and (min-width:769px) { /* TABLET */
	.ds-index-ban-size>div {position:relative; height:0; padding-bottom:50%; z-index:0;}
	
	.ds-index-ban-slide-main>* {font-size:2rem; padding-left:7%; background:rgba(255,255,255,0.9);}
	.ds-index-ban-slide-main:after {width:5%; background:linear-gradient(to right, rgba(255,255,255,0.9), rgba(255,255,255,0));}
	.ds-index-ban-slide-main-btn {font-size:0.45em; padding-top:0.25em;}
	.ds-index-ban-slide-main>a:hover {padding-left:7%;}
	
	.ds-index-title h2 {font-size:2.5rem; border-bottom-width:3px;}
	
	.ds-index-A-item {flex:0 0 49%;}
	.ds-index-A-img {padding-bottom:50%;}
	 
	.ds-index-A-txt {font-size:1.5rem; padding:1em 1em 2em 1em;}
	
	.ds-index-B-img {height:initial; padding-bottom:0;}
	.ds-index-B-txt {font-size:1.6rem; padding:1.4em;}
	.ds-index-B-txt span:first-child {padding:0 0.8em; border-width:0 2px;}
	.ds-index-B-txt strong {font-size:1.4em;}
	.ds-index-B-txt span:last-child {padding:0.6em 1.6em;}
	
	.ds-index-D>div>ul {font-size:1.7rem; margin-bottom:6%;}
	.ds-index-D-icon {font-size:2.0em;}
	.ds-index-D-txt {font-size:1em;}
}

@media all and (max-width:768px) { /* MOBILE */
	a:hover{transform:none!important;}
	.ds-index-ban-size {display:none;}
	.ds-index-ban>ul {position:relative; height:initial; align-items:stretch;}
	.ds-index-ban-slide {display:flex; background:#fff;}
	.ds-index-ban-slide-bg {position:relative; width:100%; height:0; padding-bottom:45%; }
	.ds-index-ban-slide-bg>div {position:absolute; width:100%; height:100%; left:0; right:0;}
	
	.ds-index-ban-slide-main {width:100%; justify-content:center;}
	.ds-index-ban-slide-main>* {font-size:2.0rem; padding:5% 15%; gap:1em; text-align:center; align-items:center;}
	.ds-index-ban-slide-main:after {display:none;}
	.ds-index-ban-slide-main-btn {font-size:0.6em; padding-top:0.25em;}
	.ds-index-ban-slide-main>a:hover {padding-left:10%;}
	
	.ds-index-title h2 {font-size:1.8rem; border-bottom-width:2px;}
	
	.ds-index-A-item {flex:0 0 49%;}
	.ds-index-A-img {padding-bottom:50%;}
	 
	.ds-index-A-txt {font-size:1.3rem; padding:1em 1em 2em 1em;}
	.ds-index-A-txt>strong {font-size:1.1em;}
	
	.ds-index-B-item>a {flex-direction:column!important; justify-content:center; align-items:stretch;}
	.ds-index-B-item>a>* {width:100%;}
	.ds-index-B-img {height:0; padding-bottom:35%;}
	.ds-index-B-txt {font-size:1.3rem; padding:1.4em;}
	.ds-index-B-txt span:first-child {padding:0 0.8em; border-width:0 2px;}
	.ds-index-B-txt strong {font-size:1.3em;}
	.ds-index-B-txt span:last-child {padding:0.6em 1.6em;}
	
	.ds-index-C>div>ul {display:block;}
	.ds-index-C>div>ul>li~li {margin-top:10px;}
	.ds-index-C-img {height:initial; padding:0;}
	.ds-index-C-img>div{position:relative;}
	
	.ds-index-D>div>ul {font-size:1.2rem; margin-bottom:5%;}
	.ds-index-D-icon {font-size:2.0em;}
	.ds-index-D-txt {font-size:1em;}
	.ds-index-D-item>a {padding-bottom:70%}
	.ds-index-D-item>a .ds-index-D-txt {font-weight:normal;}
}