/* Common */
.sec-subtitle {
	font-size:2rem;
	line-height:1;
}

.sec-title {
	font-size:4.6rem;
	line-height:1;
}

.sec-link {
	display: inline-flex;
	align-items: center;
	gap:10px;
	font-size:2.4rem;
	transition: all .3s ease-in-out;
} 

.sec-link i {
	display: inline-block;
	width: 28px;
	height:28px;
	border-radius:50%;
	background:#fff url('../../asset/img/main/sec00_arr_01.png') no-repeat center;
	transition: all .3s ease-in-out;
}

@media (min-width:1201px) {
	.sec-link:hover {
		color:#0052b8;	
	}

	.sec-link:hover i {
		background-color: #0052b8;
		transform: translateX(6px);
	}
}
@media (max-width:1200px) {
	.sec-subtitle {
		font-size:1.8rem;
	}

	.sec-title {
		font-size:3.4rem;
	}
	
	.sec-link {
		font-size:2rem;
	} 
}
@media (max-width:1024px) {
	.sec-link i {
		width: 24px;
		height:24px;
		background-size: auto 12px;
	}
}
@media (max-width:768px) {
	.sec-subtitle {
		font-size:1.6rem;
	}

	.sec-title {
		font-size:2.8rem;
	}
	
	.sec-link {
		font-size:1.8rem;
	} 
}
@media (max-width:576px) {
	.sec-subtitle {
		font-size:1.4rem;
	}

	.sec-title {
		font-size:2.4rem;
	}
	
	.sec-link {
		font-size:1.6rem;
	} 

	.sec-link i {
		width: 20px;
		height:20px;
		background-size: 6px auto;
	}
}


/* Sec01 */
.sec01  {
	position: relative;
	height: 820px;
	overflow: hidden;
}

.sec01 .visual {
	width:100%;
	height:100%;
}

.sec01 .swiper {
	position: relative;
	height:100%;
}

.sec01 .swiper-wrapper {
	height:100%;
}

.sec01 .swiper-slide {
	height:100%;
	overflow: hidden;
}

.sec01 .bbs-widget {
	height: 100%;
}

.sec01 .bbs-widget .bg {
	width: 100%;
	height: 100%;
}

.sec01 .bg-pc {
	display: block;
	width: 100%;
	height: 100%;
}

.sec01 .bg-mo {
	display: none;
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.sec01 img {
	margin:0 auto;
}

.sec01 .pagination {
	display: flex;
	justify-content: center;
	gap:10px;
	position: absolute;
	left:50%;
	bottom:8%;
	transform: translateX(-50%);
	z-index:2;
}

.sec01 .swiper-pagination-bullet {
	position: relative;
	width:13px;
	height:13px;
	margin:0px !important;
	background-color: rgba(255,255,255,.5);
	overflow: hidden;
	opacity: 1;
	border-radius:50px;
}

.sec01 .swiper-pagination-bullet i {
	content: "";
	display: block;
	position: absolute;
	top:0;
	left:0;
	width:0;
	height:100%;
	background-color: rgba(255,255,255,1);
	border-radius:50px;
}

.sec01 .swiper-pagination-bullet-active {
	width:120px;
}

.sec01 .swiper-pagination-bullet-active i {
	animation:paginationBar 3s ease-in forwards;
}

@media (max-width:1200px) {
	.sec01 {
		height: auto;
	}
}
@media (max-width:1024px) {
	.sec01 .pagination {
		bottom:60px;
	}

	.sec01 .swiper-pagination-bullet {
		width:10px;
		height:10px;
	}

	.sec01 .swiper-pagination-bullet-active {
		width:100px;
	}
}
@media (max-width:768px) {
	.sec01 .bg {
		position: relative;
		width:100%;
		height:0;
		padding-top:calc(980/720*100%);
		overflow: hidden;
	}

	.sec01 .bg-pc {
		display: none;
	}

	.sec01 .bg-mo {
		display: block;
	}

	.sec01 .pagination {
		bottom:40px;
	}

	.sec01 .swiper-pagination-bullet {
		width:8px;
		height:8px;
	}

	.sec01 .swiper-pagination-bullet-active {
		width:60px;
	}
}
@media (max-width:576px) {
	.sec01 .pagination {
		gap:6px;
		bottom:20px;
	}

	.sec01 .swiper-pagination-bullet {
		width:6px;
		height:6px;
	}

	.sec01 .swiper-pagination-bullet-active {
		width:40px;
	}
}


/* Sec02 */
.sec02 .intro {
	padding:50px;
	border-radius:30px;
	background-color: #f5f5f5;
}

.sec02 .intro .intro-wrap {
	gap:80px;
}

.sec02 .intro .lt {
	width: 48%;
}

.sec02 .intro .rt {
	max-width:554px;
	width: 100%;
}

.sec02 .intro .img {
	border-radius: 20px;
	overflow: hidden;
}

.sec02 .intro .txt {
	max-height:450px;
	height:100%;
	overflow-y: auto;
}

.sec02 .intro .t01 {
	font-size:3rem;
}

.sec02 .intro .t02 {
	font-size:2rem;
	line-height:1.6;
}

.sec02 .intro .btns {
	gap:10px;
}

.sec02 .intro .btns a {
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
	width:50%;
	padding:10px 10px 10px 30px;
	border-radius:50px;
	background-color: #191919;
	font-size:2rem;
	line-height:1;
	color:#fff;
	transition:all .3s ease-in-out;
}

.sec02 .intro .btns i {
	display: inline-block;
	width: 40px;
	height:40px;
	border-radius:50%;
	background:#474747 url('../../asset/img/main/sec00_arr_02.png') no-repeat center;
	transition:all .3s ease-in-out;
}

.sec02 .compose ul {
	gap:30px;
}

.sec02 .compose li {
	flex:1 0 calc(25% - 30px);
	max-width:25%;
}

.sec02 .compose a {
	position: relative;
	width:100%;
	padding: 70px 20px;
	/* height:0; */
	/* padding-top: calc(330/330*100%); */
	background-color: #f5f5f5;
	border-radius: 20px;
	overflow: hidden;
}

.sec02 .compose .txt {
	z-index:2;
	text-align: center;
}


.sec02 .compose .txt .t01 {
	font-size:2.8rem;
}

.sec02 .compose .bg {
	display: block;
	width: 100%;
	height: 134px;
	background-repeat: no-repeat;
	background-position: center;
	background-size:auto 134px;
} 

@media (min-width:1201px) {
	.sec02 .intro .btns a:hover {
		background-color: #0052b8;
	}

	.sec02 .intro .btns a:hover i {
		background-color: #0052b8;
		background-position: right 10px center;
	}

	/* .sec02 .compose li:hover .bg {
		transform: scale(1.1);
	} */
}
@media (max-width:1200px) {
	.sec02 .intro .intro-wrap {
		gap:40px;
	}

	.sec02 .intro .txt {
		max-height:260px;
	}

	.sec02 .intro .t01 {
		font-size:2.4rem;
	}
	
	.sec02 .intro .t02 {
		font-size:1.8rem;
	}

	.sec02 .intro .btns a {
		font-size:1.8rem;
	}

	.sec02 .compose a {
		padding: 50px 16px;
	}

	.sec02 .compose .txt .t01 {
		font-size:2.4rem;
	}

	.sec02 .compose .bg {
		height: 114px;
		background-size: auto 114px;
	}
}
@media (max-width:1024px) {
	.sec02 .intro {
		padding:34px;
	}

	.sec02 .intro .lt {
		width: 70%;
	}

	.sec02 .intro .rt {
		max-width:100%;
	}

	.sec02 .intro .btns {
		gap:6px;
	}

	.sec02 .intro .btns a {
		padding:6px 6px 6px 24px;
	}

	.sec02 .intro .btns i {
		width:32px;
		height:32px;
		background-size: auto 12px;
	}

	.sec02 .compose ul {
		gap:16px;
	}
	
	.sec02 .compose li {
		flex:1 0 calc(25% - 16px);
	}

	.sec02 .compose a {
		padding: 36px 12px;
	}

	.sec02 .compose .txt .t01 {
		font-size:2rem;
	}
}
@media (max-width:768px) {
	.sec02 .intro {
		padding:24px;
	}

	.sec02 .intro .intro-wrap {
		gap:30px;
	}

	.sec02 .intro .txt {
		max-height:220px;
	}

	.sec02 .intro .t01 {
		font-size:2rem;
	}
	
	.sec02 .intro .t02 {
		font-size:1.6rem;
	}

	.sec02 .intro .btns a {
		font-size:1.6rem;
	}

	.sec02 .compose ul {
		gap: 12px;
	}

	.sec02 .compose li {
		flex:1 0 calc(50% - 12px);
		max-width:50%;
	}

	.sec02 .compose a {
		padding: 28px 12px;
	}

	.sec02 .compose .txt .t01 {
		font-size:2rem;
	}

	.sec02 .compose .bg {
		height:84px;
		background-size: auto 84px;
	}
}
@media (max-width:576px) {
	.sec02 .intro {
		padding:16px;
	}

	.sec02 .intro .intro-wrap {
		gap:20px;
	}

	.sec02 .intro .lt {
		width: 100%;
	}

	.sec02 .intro .txt {
		max-height:170px;
	}

	.sec02 .intro .t01 {
		font-size:1.8rem;
	}
	
	.sec02 .intro .t02 {
		font-size:1.4rem;
	}

	.sec02 .intro .btns {
		gap:4px;
	}

	.sec02 .intro .btns a {
		width:100%;
		font-size:1.4rem;
	}

	.sec02 .intro .btns i {
		width:26px;
		height:26px;
		background-size: auto 10px;
	}

	.sec02 .compose ul {
		gap:6px;
	}
	
	.sec02 .compose li {
		flex:1 0 calc(50% - 6px);
		max-width:50%;
	}

	.sec02 .compose a {
		padding: 24px 6px;
	}

	.sec02 .compose .txt .t01 {
		font-size:1.8rem;
	}

	.sec02 .compose .bg {
		height: 64px;
		background-size: auto 64px;
	}
}


/* Sec03 */
.sec03 {
	background-color: #edf3fa;
}

.sec03 .swiper {
	height: 100%;
	overflow: hidden;
}

.sec03 .swiper-wrapper {
	height:100%;
}

.sec03 .swiper-slide {
	overflow: hidden;
}

.sec03 .prev,
.sec03 .next {
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	width:90px;
	height:80px;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	transition:opacity .3s ease;
}

.sec03 .prev {
	left:-150px;
	background-image: url('../../asset/img/main/sec03_btn_prev.png');
}

.sec03 .next {
	right:-150px;
	background-image: url('../../asset/img/main/sec03_btn_next.png');
}

.sec03 .prev.swiper-button-disabled,
.sec03 .next.swiper-button-disabled {
	opacity:.2;
}

.sec03 .pagination {
	display: none;
	justify-content: center;
	align-items: center;
	gap:10px;
	margin-top:30px;
}

.sec03 .swiper-pagination-bullet {
	width:10px;
	height:10px;
	opacity:1;
	background-color: #ccc;
}

.sec03 .swiper-pagination-bullet-active {
	background-color: #0052b8;
}

.sec03 .card {
	overflow: hidden;
	border-radius:20px;
}

.sec03 img {
	width:100%;
}

@media (max-width:1366px) {
	.sec03 .pagination {
		display: flex;
	}
}
@media (max-width:1200px) {

}
@media (max-width:1024px) {
	.sec03 .pagination {
		margin-top: 20px;
	}
}
@media (max-width:768px) {
	.sec03 .swiper-pagination-bullet {
		width:8px;
		height:8px;
	}
}
@media (max-width:576px) {
	.sec03 .pagination {
		gap:6px;
		margin-top:12px;
	}

	.sec03 .swiper-pagination-bullet {
		width:6px;
		height:6px;
	}
}


/* Sec04 */
.sec04 .din {
	display: flex;
	gap:28px;
}

.sec04 .din .lt,
.sec04 .din .rt {
	flex:1 1 calc(50% - 28px);
	max-width: 50%;
}

.sec04 .article {
	height: 100%;
	padding: 50px 40px;
	background-color: #f5f5f5;
	border-radius: 20px;
}

.sec04 .article-hd {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}

.sec04 .article-hd p {
	font-size: 3rem;
	line-height: 1;
}

.sec04 .article-hd a {
	display: block;
	width: 28px;
	height: 28px;
	background: url('../../asset/img/main/sec04_arr.png') no-repeat center / cover;
}

.sec04 .list {
	display: flex;
	flex-direction: column;
	/* justify-content: center; */
	align-items: center;
	min-height: 236px;
	padding: 30px 0px;
	border-top: 2px solid #959595;
	border-bottom: 1px solid #aaaaaa;
}

.sec04 .list li {
	width: 100%;
}

.sec04 .list li:not(:last-child) {
	padding-bottom: 20px;
}

.sec04 .list a {
	display: block;
	position: relative;
	padding-right: 140px;
}

.sec04 .list .subject {
	display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1; 
  -webkit-box-orient: vertical;
  overflow: hidden;
	width: 100%;
	font-size: 2rem;
}

.sec04 .list .data {
	display: block;
	position: absolute;
	top:50%;
	right: 0;
	transform: translateY(-50%);
	font-size: 2rem;
	color:#8c8c8c;
}

.sec04 .list li.list-message {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}

.sec04 .list li.list-message p {
	font-size: 2rem;
}

@media (min-width:1201px) {
	.sec04 .list li:hover .subject {
		text-decoration: underline;
	}
}
@media (max-width:1200px) {	
	.sec04 .din {
		gap:20px;
	}

	.sec04 .din .lt,
	.sec04 .din .rt {
		flex:1 1 calc(50% - 20px);
	}

	.sec04 .article {
		padding:40px 20px;
	}

	.sec04 .article-hd p {
		font-size: 2.4rem;
	}
	
	.sec04 .list {
		min-height: 186px;
		padding:20px 0px;
	}

	.sec04 .list li:not(:last-child) {
		padding-bottom: 12px;
	}

	.sec04 .list .subject {
		font-size: 1.8rem;
	}

	.sec04 .list .data {
		font-size: 1.8rem;
	}

	.sec04 .list li.list-message p {
		font-size: 1.8rem;
	}
}
@media (max-width:1024px) {
	.sec04 .din {
		gap:12px;
	}

	.sec04 .din .lt,
	.sec04 .din .rt {
		flex:1 1 calc(50% - 12px);
	}

	.sec04 .article {
		padding: 30px 12px;
	}

	.sec04 .article-hd {
		margin-bottom: 12px;
	}

	.sec04 .article-hd a {
		width: 24px;
		height: 24px;
	}

	.sec04 .list a {
		padding-right: 110px;
	}
}
@media (max-width:768px) {
	.sec04 .din {
		flex-wrap: wrap;
	}

	.sec04 .din .lt,
	.sec04 .din .rt {
		flex:1 1 100%;
		max-width: 100%;
	}

	.sec04 .article-hd p {
		font-size: 2rem;
	}

	.sec04 .article-hd a {
		width: 20px;
		height: 20px;
	}

	.sec04 .list {
		min-height: 146px;
		padding: 12px 0px;
	}

	.sec04 .list .subject {
		font-size: 1.6rem;
	}

	.sec04 .list .data {
		font-size: 1.6rem;
	}

	.sec04 .list li:not(:last-child) {
		padding-bottom: 8px;
	}

	.sec04 .list li.list-message p {
		font-size: 1.6rem;
	}
}
@media (max-width:576px) {
	.sec04 .article {
		padding: 24px 12px;
		border-radius: 12px;
	}

	.sec04 .list {
		min-height: 126px;
	}

	.sec04 .list a {
		padding-right: 90px;
	}

	.sec04 .list .subject {
		font-size: 1.4rem;
	}

	.sec04 .list .data {
		font-size: 1.4rem;
	}

	.sec04 .list li:not(:last-child) {
		padding-bottom: 6px;
	}

	.sec04 .list li.list-message p {
		font-size: 1.4rem;
	}
} 


/* Animation */
@keyframes paginationBar {
	0% {
		width:0;
	}
	100% {
		width: 100%;
	}
}

/* Inquiry Modal */
.inquiry-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	place-items: center;
	z-index: 9999999;
}

.inquiry-modal.open {
	display: block;
}

.inquiry-modal .modal-container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	max-width:500px;
	max-height: none;
	width: 95%;
	height:auto;
	margin:10px auto;
}

.inquiry-modal .modal-background {
	width:100%;
	height:100%;
	background-color: rgba(0, 0, 0, 0.5);
	cursor: pointer;
}

.inquiry-modal .modal-inner {
	width: 100%;
	height: 100%;
	position: relative;
}

.inquiry-modal .modal-area {
	position: relative;
	padding:90px 40px 30px;
	background-color: #fff;
	border-radius: 10px;
}

.inquiry-modal .modal-close {
	display: block;
	position: absolute;
	top:20px;
	right:20px;
	width:20px;
	height:20px;
	background:url('../../asset/img/form/modal_close.png') no-repeat center;
}

.inquiry-modal .txt .t01 {
	font-size:2rem;
}

.inquiry-modal input {
	width:100%;
	height:45px;
	padding:0px 20px;
	border:1px solid #a0a0a0;
	border-radius:10px;
	font-size:1.6rem;
	line-height:45px;
}

.inquiry-modal .btns {
	display: flex;
	justify-content: center;
	gap:20px;
	margin-top:40px;
}

.inquiry-modal .btns button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	max-width:200px;
	width:100%;
	height: 50px;
	border-radius:10px;
	background-color:#000;
	font-size:1.8rem;
	line-height: 50px;
	color:#fff;
}

@media (max-width:1200px) {	
	.inquiry-modal .txt .t01 {
		font-size:1.8rem;
	}

	.inquiry-modal .btns button {
		max-width:160px;
		height: 44px;
		font-size:1.6rem;
	}
}
@media (max-width:1024px) {
	.inquiry-modal .modal-area {
		padding:70px 30px 20px;
	}

	.inquiry-modal .btns {
		gap:16px;
		margin-top:30px;
	}
}
@media (max-width:768px) {
	.inquiry-modal .txt .t01 {
		font-size:1.6rem;
	}

	.inquiry-modal .btns button {
		max-width:140px;
		height: 40px;
		font-size:1.4rem;
	}
}
@media (max-width:576px) {
	.inquiry-modal .txt .t01 {
		font-size:1.5rem;
	}

	.inquiry-modal .btns {
		gap:8px;
		margin-top:20px;
	}

	.inquiry-modal .btns button {
		max-width:120px;
		height: 36px;
		font-size:1.3rem;
	}
}

/* Popup */
#popup {
	position: relative;
}

.popup-layer {
	z-index: 10000;
	position: absolute;
	background: #fff;
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,.25);
	animation: popup-fade .65s ease-in-out .35s forwards;
	opacity: 0;
	max-width:800px;
}

@keyframes popup-fade {
	0% { opacity: 0;
		-webkit-transform: translateY(25px);
		-ms-transform: translateY(25px);
		transform: translateY(25px); }
	100% { opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0); }
}
.popup-layer__body {
	background: #fff;
}

.popup-layer__body img {
	display: block;
	margin: 0 auto;
	border: none;
	max-width: 100%;
}

.popup-layer__foot {
	background: #424242;
}

.popup-layer__foot ul {
	display:flex;
	flex-wrap: wrap;
}

.popup-layer__foot li {
	width:50%;
	padding:10px;
}

.popup-layer__foot li:first-child {
	padding-right:0;
}

.popup-layer__foot li:last-child {
	text-align: right;
}

.popup-layer__foot span {
	font-size: 1.5rem;
	color: #fff;
	cursor: pointer;
	transition:all 0.3s ease;
}

.popup-layer__foot label:hover span { opacity: .7; }

/* .popup-layer-foot { background: #424242; }
.popup-layer-foot span { font-size: 15px; color: #fff; }
.popup-layer-foot label:hover span { opacity: .7; }
.popup-layer-foot li:first-child { padding-right: 0; }
.popup-layer-foot li:last-child { text-align: right; } */


@media (max-width: 1024px){
	/* .popup-layer { z-index: 999; } */
	.popup-layer { top: 95px !important; left: 0 !important; margin: 0 5px; }
}
@media (max-width: 768px){

	.popup-layer {
		width:calc(100% - 10px);
	}

	.popup-layer img {
		max-width: none;
		width:100%;
		height: auto !important;
	}
	.popup-layer-foot span { font-size: 14px; }

}
@media (max-width: 375px){
	.popup-layer-foot li { width: 100%; }
	.popup-layer-foot li:last-child { text-align: left; }
}