@charset "utf-8";
h2.mainTitle{line-height: 124%}
h2.mainTitle span{display:inline-block; color:var(--color-primary)}

span.mainTitle{display: block; color: var(--color-text-lighter)}
p.mainTitle{line-height: 151%}
a.mainTitle{display: block; color: var(--color-text); border: 1px solid; border-radius: 500px; text-align: center; box-sizing: border-box; transition: .3s}
a.mainTitle:hover{border-color: var(--color-primary); background-color: var(--color-primary); color: #fff}

@media screen and (max-width:767px){
}
@media screen and (min-width:768px) and (max-width:1280px){
	h2.mainTitle{white-space: pre-line}
	p.mainTitle{white-space: pre-line}
}
@media screen and (max-width:1280px){
	section.section div.cont{margin: 6.67rem 0}
	h2.mainTitle{font-size: 2rem}

	span.mainTitle{font-size: 14px}
	p.mainTitle{font-size: 1.07rem}
	a.mainTitle{font-size: 1.07rem; padding: 1rem; width: 8rem}
}

@media screen and (min-width:1281px){
	section.section div.cont{margin: 12.5rem 0}
	h2.mainTitle{font-size: 3.87rem; white-space: pre-line}

	span.mainTitle{font-size: 1.25rem}
	p.mainTitle{white-space: pre-line; font-size: 1.13rem}
	a.mainTitle{font-size: 1.13rem; padding: 1.25rem; width: 11.25rem}
}

section#section1 div.cont.cont1{display: flex}
section#section1 div.cont.cont1 div.right{display: flex}
section#section1 div.cont.cont1 div.right img{max-width: 100%}
@media screen and (max-width:1280px){
	section#section1 div.cont.cont1{flex-direction: column; align-items: center}
	section#section1 div.cont.cont1 h2.mainTitle{text-align:center; margin-bottom: 1rem}
	section#section1 div.cont.cont1 span.mainTitle{text-align:center}
	section#section1 div.cont.cont1 p.mainTitle{text-align:center; margin: 1.33rem 0 2.67rem}
	section#section1 div.cont.cont1 a.mainTitle{margin:0 auto 3.33rem}
}
@media screen and (min-width:1281px){
	section#section1 div.cont.cont1{align-items: center}
	section#section1 div.cont.cont1 div.left{width: 50%}
	section#section1 div.cont.cont1 h2.mainTitle{margin-bottom: 1.56rem}
	section#section1 div.cont.cont1 p.mainTitle{margin: 3.12rem 0 5rem}
	section#section1 div.cont.cont1 div.right{width: 50%; justify-content: flex-end}
}


section#section2{position: relative}
@keyframes text-animation-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
div.cont2_img.left img{max-width: 100%}
p.cont2_text{font-weight: 700; line-height: 160%}

@media screen and (max-width:767px){
}
@media screen and (min-width:768px) and (max-width:1280px){
	p.cont2_text{white-space: pre-line}
}
@media screen and (max-width:1280px){
	section#section2{position: relative}
	section#section2 div.text-animation{display:none}
	section#section2 div.cont.cont2{display: flex; flex-direction: column-reverse}
	section#section2 div.cont.cont2 div.inner.right{margin-bottom:3.33rem}
	section#section2 div.cont.cont2 h2.mainTitle{text-align:center}
	section#section2 div.cont.cont2 p.cont2_text{text-align:center}
	section#section2 div.cont.cont2 a.mainTitle{margin: 0 auto}
	p.cont2_text{font-size: 1.14rem; margin: 1.33rem 0 3.33rem}
	div.cont2_img.left{max-width: 30rem; width: 100%; margin: 0 auto}
}
@media screen and (min-width:1281px){
	section#section2{position: relative}
	section#section2 div.text-animation{white-space: nowrap; box-sizing: border-box; overflow: hidden; position:absolute; top:-160px}
	section#section2 div.text-animation p{display: inline-block; animation: text-animation-left 100s linear infinite; font-weight:700; color:#ededed; font-size:14.37rem}
	section#section2 div.cont.cont2 div.inner.right{position: relative}
	section#section2 div.cont.cont2 div.mainTitle{position: absolute; right: 0; bottom: 0; width: 50%}
	p.cont2_text{font-size: 1.5rem; margin: 3.12rem 0 6.25rem}
	div.cont2_img.left{width: 40%}
}
@media screen and (min-width:1920px){
	div.cont2_img.left{width: 50%}
}

section#section3 div.cont.cont3{position:relative}
div.cont3_textSlide > ul{display: flex}
div.cont3_textSlide > ul > li{flex-shrink: 0;opacity: 0 !important; transition: opacity 0.5s ease}
div.cont3_textSlide > ul > li.swiper-slide-active {opacity: 1 !important}
h2.cont3_textSlide:before{content: ''; display: inline-block; background-color: var(--color-primary)}
div.cont3_textSlide > ul > li > ul > li{font-size: 20px; margin-bottom: 20px; color: var(--color-text-light);}
div.cont3_imgSlide{overflow: hidden}
div.cont3_imgSlide ul{display: flex; align-items:center}
div.cont3_imgSlide ul > li{flex-shrink: 0; opacity: .5; background-color: var(--color-background-secondary); aspect-ratio: 3 / 4; display: flex; align-items: center; justify-content: center}
div.cont3_imgSlide ul > li.swiper-slide-active{aspect-ratio: 3 / 4; opacity: 1}
div.cont3_imgSlide ul > li img{width: 100%}
div.cont3_imgSlide .swiper-button-prev, div.cont3_imgSlide .swiper-button-next{position: absolute; top: 0; cursor: pointer; display: flex; justify-content: center; align-items: center; background-color: var(--color-button-background)}
div.cont3_imgSlide .swiper-button-prev svg, div.cont3_imgSlide .swiper-button-next svg{fill: #fff}

@media screen and (max-width:767px){
	div.cont3_textSlide{margin-top: 3.57rem}
	h2.cont3_textSlide{margin-bottom: 2.14rem}
	div.cont3_imgSlide{margin-top: 2.14rem; padding: 0 3vw}
	div.cont3_imgSlide_btn{position: absolute; top: 0; right: 7.86rem}
	div.cont3_imgSlide ul{height: 32.14rem}
}
@media screen and (min-width:768px) and (max-width:1280px){
	section#section3 div.cont.cont3{display: flex; height: 28rem}
	section#section3 div.cont.cont3 .inner{width: 50%}
	div.cont3_textSlide{margin-top: 5.33rem}
	h2.cont3_textSlide{margin-bottom: 2.67rem}
	section#section3 div.cont.cont3 div.right{width: 50%}
	div.cont3_imgSlide{height: 37.33rem; margin-left: 2rem}
	div.cont3_imgSlide ul{height: 18.67rem; margin-top: 6rem}
	div.cont3_imgSlide_btn{display:none}
}
@media screen and (max-width:1280px){
	div.cont3_textSlide > ul{padding-left: 3vw}
	div.cont3_textSlide > ul > li{padding: 0 3vw}
	h2.cont3_textSlide{font-size: 1.47rem}
	h2.cont3_textSlide:before{width: 1rem; height: 3px; transform: translate(0, -200%); margin-right: 1rem}
	div.cont3_textSlide > ul > li > ul > li{font-size: 16px; margin-bottom: 1rem}
	div.cont3_imgSlide ul > li{width: 18.67rem}
	div.cont3_imgSlide ul > li.swiper-slide-active{width: 21.33rem}
	div.cont3_imgSlide .swiper-button-prev, div.cont3_imgSlide .swiper-button-next{width: 2.67rem; height: 2.67rem}
	div.cont3_imgSlide .swiper-button-prev{left: 0}
	div.cont3_imgSlide .swiper-button-next{left: 3.33rem}
	div.cont3_imgSlide .swiper-button-prev svg, div.cont3_imgSlide .swiper-button-next svg{width: 10px}
}
@media screen and (min-width:1281px){
	section#section3 div.cont.cont3{height: 37.5rem; margin: 25rem 0}
	section#section3 div.cont.cont3 div.left{width: 50%}
	div.cont3_textSlide{margin-top: 6.25rem}
	div.cont3_textSlide > ul{padding-left: 1.25rem}
	div.cont3_textSlide > ul > li{padding: 0 1.25rem}
	h2.cont3_textSlide{font-size: 2.5rem; margin-bottom: 3.12rem}
	h2.cont3_textSlide:before{width: 1.25rem; height: 4px; transform: translate(0, -250%); margin-right: 1.25rem}
	div.cont3_textSlide > ul > li > ul > li{font-size: 1.25rem; margin-bottom: 1.25rem}
	div.cont3_imgSlide{position: absolute; right: 0; top: 0; width: 50%; margin-left: 2.5rem; height: 43.75rem}
	div.cont3_imgSlide ul{height: 35rem; margin-top: 6.87rem}
	div.cont3_imgSlide ul > li{box-shadow: 12px 4px 13px rgba(0, 0, 0, .2); width: 25rem}
	div.cont3_imgSlide ul > li.swiper-slide-active{width: 440px}
	div.cont3_imgSlide_btn{position: absolute; top: 0}
	div.cont3_imgSlide .swiper-button-prev, div.cont3_imgSlide .swiper-button-next{width: 3.75rem; height: 3.75rem}
	div.cont3_imgSlide .swiper-button-prev{left: 0}
	div.cont3_imgSlide .swiper-button-next{left: 4.37rem}
	div.cont3_imgSlide .swiper-button-prev svg, div.cont3_imgSlide .swiper-button-next svg{width: 14px}
}

section#section4 div.cont.cont4{display: flex; flex-direction: column}
div.cont4_wrap{display: flex}
div.cont4_wrap img{max-width: 100%}
ul.cont4_text{display: flex; flex-direction: column}
li.cont4_text{display: flex; align-items: center; font-weight: 700}
li.cont4_text svg{fill: var(--color-primary)}
p.cont4_text{font-weight: 700; line-height: 150%}
@media screen and (max-width:767px){
	section#section4 div.cont.cont4{gap: 3.57rem}
    div.cont4_wrap{gap: 3.57rem; flex-direction: column-reverse}
	div.cont4_img.left{padding: 0 3vw; height: 21.43rem; overflow: hidden; display: flex; align-items: center}
	div.cont4_text.right{padding: 0 3vw}
	
	div.cont4_img.right{display: none}
}
@media screen and (min-width:768px) and (max-width:1280px){
	section#section4 div.cont.cont4{gap: 6.67rem}
	div.cont4_wrap{gap:6.67rem}
	div.cont4_wrap .right{width: 50%}
	div.cont4_wrap .left{width: 50%}
	div.cont4_text.right{padding-right: 1.33rem}
}
@media screen and (max-width:1280px){
	ul.cont4_text{margin-top: 3.33rem; gap: 1.33rem}
	li.cont4_text{font-size: 1.33rem}
	li.cont4_text svg{width: 2rem; margin-right: 1.33rem}
	p.cont4_text{font-size: 1.33rem; margin-bottom: 3.33rem}
}

@media screen and (min-width:1281px){
	section#section4 div.cont.cont4{gap: 12.5rem}
	div.cont4_wrap{gap:12.5rem}
	div.cont4_wrap .right{width: 50%}
	div.cont4_wrap .left{width: 50%}
	div.cont4_text.right{padding-right: 1.25rem}
	ul.cont4_text{margin-top: 6.25rem; gap: 1.87rem}
	li.cont4_text{font-size: 1.87rem}
	li.cont4_text svg{width: 2.5rem; margin-right: 1.87rem}
	p.cont4_text{font-size: 1.87rem; white-space: pre-line; margin-bottom: 6.25rem}
}


section#section5{padding:150px 0; background: url(/image/main/cont5_backimg.jpg) no-repeat 50% 0; background-size: cover}
section.section div.cont5{margin: 0}
div.cont5_text h2.mainTitle{color: #fff; text-align: center; margin-bottom: 50px}
div.cont5_text p.cont5_text{color: #fff; text-align: center; font-weight: 600; line-height: 150%; font-size:24px; white-space:pre-line}
div.cont5_text a.mainTitle{border-color: #fff; color: #fff; margin: 100px auto 0}
div.cont5_text a.mainTitle:hover{border-color:var(--color-primary)}
@media screen and (max-width:1280px){
	section#section5{padding:5.33rem 0}
	div.cont5_text h2.mainTitle{margin-bottom: 2rem}
	div.cont5_text p.cont5_text{font-size:1.07rem; white-space:pre-line}
	div.cont5_text a.mainTitle{margin: 3.33rem auto 0}
}
@media screen and (min-width:1281px){
	section#section5{padding:9.37rem 0}
	div.cont5_text h2.mainTitle{margin-bottom: 3.12rem}
	div.cont5_text p.cont5_text{font-size:1.5rem; white-space:pre-line}
	div.cont5_text a.mainTitle{margin: 6.25rem auto 0}
}


div.cont6_text h2.mainTitle{text-align: center}
p.cont6_text{text-align: center; font-weight: 700; white-space: pre-line; line-height: 150%}
ul.cont6_list{display: flex; flex-wrap:wrap}
li.cont6_list{display: flex; justify-content: center; box-sizing: border-box}
div.cont6_list_icon{display: flex; justify-content: center}
h3.cont6_list_text{text-align: center}
p.cont6_list_text{text-align: center; font-weight: 300; line-height: 160%}
@media screen and (max-width:767px){
	ul.cont6_list{gap: 0.71rem}
	li.cont6_list{width: calc((100% - 0.71rem) / 2)}
	li.cont6_list:nth-child(2), li.cont6_list:nth-child(3){background-color: var(--color-background-primary)}
	li.cont6_list:nth-child(1), li.cont6_list:nth-child(4){background-color: var(--color-background-secondary)}
	li.cont6_list:nth-child(1) div.cont6_list_icon svg, li.cont6_list:nth-child(4) div.cont6_list_icon svg{fill: var(--color-primary)}
	li.cont6_list:nth-child(2) div.cont6_list_icon svg, li.cont6_list:nth-child(3) div.cont6_list_icon svg{fill: #fff}
	li.cont6_list:nth-child(2) h3.cont6_list_text, li.cont6_list:nth-child(3) h3.cont6_list_text{color:#fff}
	li.cont6_list:nth-child(2) p.cont6_list_text, li.cont6_list:nth-child(3) p.cont6_list_text{color:#fff}
}
@media screen and (min-width:768px) and (max-width:1280px){
	li.cont6_list{width: calc(100% / 4)}
	li.cont6_list:nth-child(2n-1){background-color: var(--color-background-secondary)}
	li.cont6_list:nth-child(2n){background-color: var(--color-background-primary)}
	li.cont6_list:nth-child(2n-1) div.cont6_list_icon svg{fill: var(--color-primary)}
	li.cont6_list:nth-child(2n) div.cont6_list_icon svg{fill: #fff}
	li.cont6_list:nth-child(2n) h3.cont6_list_text{color:#fff}
	li.cont6_list:nth-child(2n) p.cont6_list_text{color:#fff}
}
@media screen and (max-width:1280px){
	div.cont6_text h2.mainTitle{margin-bottom: 2rem}
	p.cont6_text{font-size: 1.2rem; white-space: pre-line}
	div.cont6_list{margin-top: 3.33rem}
	li.cont6_list{padding: 4rem 1rem}
	div.cont6_list_icon{margin-bottom: 2rem}
	div.cont6_list_icon svg{width: 3.33rem; height: 3.33rem}
	h3.cont6_list_text{font-size: 1.47rem; margin-bottom:1.33rem}
	p.cont6_list_text{font-size: 1rem}
}
@media screen and (min-width:1281px){
	div.cont6_text h2.mainTitle{margin-bottom: 3.12rem}
	p.cont6_text{font-size: 1.5rem; white-space: pre-line}
	div.cont6_list{margin-top: 6.25rem}
	li.cont6_list{width: calc(100% / 4); padding: 6.87rem 1.25rem}
	li.cont6_list:nth-child(2n-1){background-color: var(--color-background-secondary)}
	li.cont6_list:nth-child(2n){background-color: var(--color-background-primary)}
	div.cont6_list_icon{margin-bottom: 3.12rem}
	div.cont6_list_icon svg{width: 4.37rem; height: 4.37rem}
	li.cont6_list:nth-child(2n-1) div.cont6_list_icon svg{fill: var(--color-primary)}
	li.cont6_list:nth-child(2n) div.cont6_list_icon svg{fill: #fff}
	h3.cont6_list_text{font-size: 1.87rem; margin-bottom: 1.87rem}
	li.cont6_list:nth-child(2n) h3.cont6_list_text{color:#fff}
	p.cont6_list_text{font-size: 1.13rem; white-space: pre-line}
	li.cont6_list:nth-child(2n) p.cont6_list_text{color:#fff}
}