@charset "utf-8";

#index {
	display: flex;

	flex-direction: column;

	gap: 180px;
}

#visual .inner img {
	width: 100%;
}

#visual .mo_bnn {
	display: none;
}

#visual .splide__pagination {
	border-radius: 30px;

	background: rgba(0, 0, 0, 0.25);

	box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.15);

	left: 50%;

	bottom: 50px;

	transform: translateX(-50%);

	padding: 10px 15px;

	width: max-content;
}

#visual .splide__pagination .splide__pagination__page {
	width: 20px;

	height: 20px;

	background-color: #ccc;

	border-radius: 999px;

	opacity: 1;
}

#visual .splide__pagination .splide__pagination__page.is-active {
	transform: unset;

	width: 40px;

	background-color: #fff;
}

#section02 .sec02 {
	display: flex;

	align-items: stretch;

	gap: 40px;
}

#section02 .sec02 .sec02_wrap {
	display: flex;

	align-items: stretch;

	gap: 40px;

	flex: 1;
}

#news {
	flex: 1;

	max-width: 600px;

	display: flex;

	flex-direction: column;

	gap: 20px;
}

#news .news_title {
	display: flex;

	align-items: center;

	justify-content: space-between;
}

#news .news_title p {
	font-size: 1.77rem;

	font-weight: 800;

	font-family: "SUITE";
}

#news .news_title .splide__arrows {
	display: flex;

	align-items: center;

	gap: 5px;
}

#news .news_title .splide__arrows button {
	background: transparent;
}

#news .news_title .splide__arrows .splide__arrow {
	position: unset;

	transform: unset;

	opacity: 1;

	width: 35px;

	height: 35px;

	border-radius: unset;
}

#news .news_title .splide__arrows .splide__arrow svg {
	width: auto;

	height: auto;

	transform: unset;
}

#news .news_title .splide__arrows .more_btn {
	display: flex;

	align-items: center;

	justify-content: center;

	width: 35px;

	height: 35px;

	border-radius: 999px;

	border: 2px solid #1daab6;

	background-color: #1daab6;
}

#news .news_title .splide__arrows .more_btn:hover {
	background-color: #fff;
}

#news .news_title .splide__arrows .more_btn:hover svg path {
	fill: #1daab6;
}

#news .news_cont .inner {
	display: flex;

	flex-direction: column;

	gap: 15px;

	padding: 10px 0;
}

#news .news_cont .inner .img {
	border-radius: 40px;
}

#news .news_cont .inner .img img {
	border-radius: 40px;

	width: 100%;
}

#news .news_cont .inner .slide_txt {
	display: flex;

	flex-direction: column;

	gap: 15px;
}

#news .news_cont .inner .slide_txt .slide_ti {
	font-size: 1.33rem;

	font-weight: 800;

	letter-spacing: -0.72px;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis; /* 말줄임 적용 */

	font-family: "SUITE";
}

#news .news_cont .inner .slide_txt .slide_co {
	font-size: 1rem;

	font-weight: 400;

	letter-spacing: -0.54px;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis; /* 말줄임 적용 */
}

#news .news_cont .inner:hover .img {
	box-shadow: 0px 0px 10px 0px rgba(189, 189, 189, 0.8);
}

#news .news_cont .inner:hover .slide_txt .slide_ti {
	color: #1daab6;
}

#food {
	width: 340px;

	display: flex;

	flex-direction: column;

	gap: 20px;
}

#food .food_title p {
	font-size: 1.77rem;

	font-weight: 800;

	text-align: center;

	font-family: "SUITE";
}

#food .food_cont {
	background-color: #def6f8;

	border-radius: 40px;

	padding: 30px 30px 0;

	height: 100%;
}

#food .food_cont .ix_box {
	display: flex;

	flex-direction: column;

	justify-content: space-between;

	height: 100%;
}

#food .food_cont .ix_box .ix_date {
	background-color: #fff;

	border-radius: 30px;

	padding: 10px;

	text-align: center;
}

#food .food_cont .ix_box .ix_date span {
	font-size: 1.44rem;

	font-weight: 700;

	text-align: center;

	font-family: "SUITE";
}

#food .food_cont .ix_box .ix_content {
	font-size: 1.11rem;

	font-weight: 400;

	text-align: center;

	letter-spacing: -0.6px;

	line-height: 200%;
}

#food .food_cont .ix_box .ix_more {
	background-color: #fff;

	border-radius: 30px 30px 0 0;

	display: block;

	max-width: 240px;

	width: 96%;

	margin: 0 auto;

	padding: 10px;

	font-size: 1.11rem;

	font-weight: 700;

	text-align: center;

	font-family: "SUITE";
}

#food .food_cont .ix_box .ix_more:hover {
	color: #1daab6;
}

#information {
	display: flex;

	flex-direction: column;

	gap: 40px;

	width: 380px;
}

#information .imformation_box {
	border-radius: 40px;

	padding: 0 35px;

	position: relative;

	height: 258px;

	display: flex;

	align-items: center;

	justify-content: flex-start;

	background-repeat: no-repeat;

	background-position: right 35px top 35px;

	transition: all 0.3s;
}

#information .imformation_box .information_text {
	display: flex;

	flex-direction: column;

	gap: 15px;
}

#information .imformation_box .information_text .information_ti {
	font-size: 1.66rem;

	font-weight: 800;

	line-height: 140%;

	font-family: "SUITE";
}

#information .imformation_box .information_text .information_co {
	font-size: 1.11rem;

	font-weight: 400;

	line-height: 140%;

	letter-spacing: -0.6px;
}

#information .imformation_box .more_btn {
	background-color: #fff;

	position: absolute;

	right: 0;

	bottom: 0;

	border-radius: 40px 0 0 0;

	padding: 15px 0 0 15px;
}

#information .imformation_box .more_btn div {
	width: 65px;

	height: 65px;

	background-color: #555;

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;
}

#information .imformation_box .more_btn::before,
#information .imformation_box .more_btn::after {
	content: "";

	width: 40px;

	height: 40px;

	position: absolute;

	background-repeat: no-repeat;

	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M40 40L0 40C0 40 17.3543 39.4457 28.4 28.4C39.4457 17.3543 40 0 40 0L40 40Z' fill='white'/%3E%3C/svg%3E");
}

#information .imformation_box .more_btn::before {
	right: 0;

	top: -40px;
}

#information .imformation_box .more_btn::after {
	left: -40px;

	bottom: 0;
}

#information .imformation_box01 {
	background-color: #dff4ff;

	background-image: url(../img/main/imformation_box01.png);
}

#information .imformation_box02 {
	background-color: #fff9c8;

	background-image: url(../img/main/imformation_box02.png);
}

#information .imformation_box:hover .more_btn svg {
	transform: translate3d(5px, 5px, 5px);

	transition: all 0.3s;
}

#information .imformation_box:hover {
	background-position: right 35px top 25px;

	transition: all 0.3s;
}

#section03 {
	position: relative;
}

#section03::before {
	content: "";

	width: 90%;

	max-width: 1465px;

	height: 560px;

	border-radius: 0px 999px 999px 0px;

	background: RGBA(192, 250, 255, 0.25);

	background: linear-gradient(260deg, rgba(192, 250, 255, 0.25) -4.37%, rgba(170, 218, 254, 0.25) 108.31%);

	position: absolute;

	left: 0;

	top: -40px;

	z-index: -1;
}

#section03 .mircenter {
	display: flex;

	flex-direction: column;

	gap: 120px;
}

#section03 .sec03 {
	display: flex;

	align-items: stretch;

	gap: 40px;

	padding: 80px 0;
}

#section03 .sec03_wrap {
	display: flex;

	align-items: stretch;

	gap: 40px;

	flex: 1;
}

#using {
	width: 400px;

	display: flex;

	flex-direction: column;
}

#using .using_box .using_text {
	display: flex;

	flex-direction: column;

	gap: 10px;
}

#using .using_box .using_text .using_ti {
	font-size: 1.44rem;

	font-weight: 800;

	line-height: 1;

	color: #2685c0;

	font-family: "SUITE";
}

#using .using_box .using_text .using_co {
	font-size: 1.77rem;

	font-weight: 800;

	letter-spacing: -0.96px;

	font-family: "SUITE";

	line-height: 1.1;
}

#using .using_box .using_text .using_mini_co {
	font-size: 1rem;

	font-weight: 400;

	letter-spacing: -0.54px;

	line-height: 111%;

	color: #444;
}

#using .using_box01 {
	background-color: #fff;

	border-radius: 40px 40px 0 0;

	padding: 30px 30px 0;

	display: flex;

	flex-direction: column;

	gap: 20px;

	background-image: url(../img/main/using_box01.png);

	background-repeat: no-repeat;

	background-position: right 30px bottom 50px;
}

#using .using_box01 .using_notice {
	background-color: #ff9d00;

	border-radius: 20px 20px 0 0;

	padding: 3px 5px;

	width: 94%;

	max-width: 340px;

	margin: 0 auto;
}

#using .using_box01 .using_notice p {
	font-size: 0.88rem;

	font-weight: 700;

	letter-spacing: -0.48px;

	line-height: 175%;

	color: #fff;

	text-align: center;
}

#using .using_box02 {
	border-radius: 0 0 40px 40px;

	background-color: #d4f0ff;

	padding: 30px 30px 72px;

	display: flex;

	flex-direction: column;

	gap: 20px;

	position: relative;

	background-image: url(../img/main/using_box02.png);

	background-repeat: no-repeat;

	background-position: right 30px bottom 70px;
}

#using .using_box02 .using_ars {
	width: 94%;

	max-width: 340px;

	background-color: #2685c0;

	border-radius: 20px;

	padding: 7px 15px;

	position: absolute;

	left: 50%;

	top: calc(100% - 55px);

	transform: translateX(-50%);

	transition: padding 0.3s ease;

	z-index: 9;
}

#using .using_box02 .using_ars.open {
	padding: 15px;

	transition: padding 0.3s ease;
}

#using .using_box02 .using_ars .ars_title {
	display: flex;

	align-items: center;

	justify-content: space-between;
}

#using .using_box02 .using_ars .ars_title p {
	font-size: 0.88rem;

	font-weight: 800;

	color: #fff;

	line-height: 1;

	font-family: "SUITE";
}

#using .using_box02 .using_ars .ars_title button {
	background: #fff;

	border-radius: 999px;

	padding: 3px 8px;

	font-size: 0.77rem;

	font-weight: 700;

	color: #2685c0;

	font-family: "SUITE";
}

#using .using_box02 .using_ars .ars_cont {
	background-color: #fff;

	display: flex;

	flex-direction: column;

	gap: 5px;

	border-radius: 20px;

	max-height: 0;

	overflow: hidden;

	padding: 0 10px; /* ✅ 기본 패딩 */

	margin-top: 0; /* ✅ 기본 마진 */

	transition: all 0.35s ease;
}

#using .using_box02 .using_ars.open .ars_cont {
	max-height: 500px;

	padding: 10px;

	margin-top: 10px;
}

#using .using_box02 .using_ars .ars_cont ul {
	display: flex;

	align-items: center;

	gap: 5px;
}

#using .using_box02 .using_ars .ars_cont .ars_number {
	border: 1px solid #2685c0;

	border-radius: 999px;

	padding: 3px 8px;

	width: 40px;

	font-size: 0.77rem;

	font-weight: 700;

	line-height: 85%;

	letter-spacing: -0.42px;

	color: #105e8f;

	text-align: center;
}

#using .using_box02 .using_ars .ars_cont .ars_co {
	flex: 1;

	font-size: 0.77rem;

	font-weight: 600;

	letter-spacing: -0.42px;

	line-height: 142%;
}

#notice {
	flex: 1;

	width: 510px;

	background-color: #fff;

	border-radius: 40px;

	box-shadow: 0px 0px 20px 0px #c8f0ff;

	padding: 30px;

	display: flex;

	flex-direction: column;

	gap: 20px;
}

#notice .notice_tab {
	display: flex;

	align-items: center;

	justify-content: space-between;

	margin-top: 20px;
}

#notice .notice_tab .notice_title {
	font-size: 1.55rem;

	font-weight: 800;

	color: #222;

	font-family: "SUITE";
}

#notice .notice_tab .tab_btns {
	display: flex;

	align-items: center;

	gap: 10px;
}

#notice .notice_tab .tab_btns li a {
	border: 1px solid #aaa;

	border-radius: 5px;

	padding: 5px 10px;

	font-size: 0.88rem;

	font-weight: 500;

	text-align: center;

	color: #777;

	position: relative;

	z-index: 1;

	font-family: "SUITE";
}

#notice .notice_tab .tab_btns li a::before {
	content: "";

	width: 0;

	height: 100%;

	background-color: #1a9bdf;

	position: absolute;

	left: 0;

	top: 0;

	z-index: -1;
}

#notice .notice_tab .tab_btns li a:hover {
	color: #fff;
}

#notice .notice_tab .tab_btns li a:hover::before {
	width: 100%;

	transition: width 0.5s;
}

#notice .notice_tab .tab_btns li a.on {
	border-color: #1a9bdf;

	background-color: #1a9bdf;

	color: #fff;

	font-weight: 800;
}

#notice .tab_contents .tab_board {
	display: none;
}

#notice .tab_contents .tab_board.on {
	display: block;
}

#notice .tab_contents .tab_board .notice_board {
	display: flex;

	flex-direction: column;

	gap: 20px;
}

#notice .tab_contents .tab_board .firat_list .board_link .list_cont {
	display: flex;

	align-items: center;

	gap: 20px;
}

#notice .tab_contents .tab_board .firat_list .board_link .list_cont .laC_date {
	width: 65px;

	height: 65px;

	border: 1px solid #ddd;

	border-radius: 10px;

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: center;

	gap: 5px;
}

#notice .tab_contents .tab_board .firat_list .board_link .list_cont .laC_date span {
	font-size: 1.66rem;

	font-weight: 600;

	color: #222;

	line-height: 66%;
}

#notice .tab_contents .tab_board .firat_list .board_link .list_cont .laC_date p {
	font-size: 0.77rem;

	font-weight: 200;

	line-height: 1;

	letter-spacing: -0.7px;

	color: #222;
}

#notice .tab_contents .tab_board .firat_list .board_link .list_cont .laC_sbjt2 {
	flex: 1;

	font-size: 1.11rem;

	font-weight: 500;

	color: #222;

	line-height: 140%;

	overflow: hidden;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;
}

#notice .tab_contents .tab_board .firat_list .board_link .list_cont .laC_sbjt2 .new_icon {
	width: 22px;

	height: 22px;

	display: inline-block;

	align-items: center;

	justify-content: center;

	background-color: #f38414;

	border-radius: 999px;

	font-size: 0.77rem;

	font-weight: 800;

	color: #fff;

	letter-spacing: -0.7px;

	text-align: center;
}

#notice .tab_contents .tab_board .firat_list .board_link:hover .list_cont .laC_sbjt2 {
	color: #1a9bdf;
}

#notice .tab_contents .tab_board .wrap_list {
	display: flex;

	flex-direction: column;

	gap: 10px;
}

#notice .tab_contents .tab_board .wrap_list .board_link {
	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 10px;

	padding: 5px 10px 5px 25px;

	position: relative;
}

#notice .tab_contents .tab_board .wrap_list .board_link::before {
	content: "";

	width: 5px;

	height: 5px;

	background-color: #ddd;

	border-radius: 50%;

	position: absolute;

	left: 10px;

	top: 50%;

	transform: translateY(-50%);
}

#notice .tab_contents .tab_board .wrap_list .board_link .laC_sbjt {
	flex: 0.9;

	font-size: 1rem;

	font-weight: 400;

	color: #222;

	line-height: 111%;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis; /* 말줄임 적용 */
}

#notice .tab_contents .tab_board .wrap_list .board_link .laC_date {
	font-size: 0.77rem;

	font-weight: 400;

	color: #444;
}

#notice .tab_contents .tab_board .wrap_list .board_link:hover .laC_sbjt {
	color: #1a9bdf;
}

#golink {
	display: flex;

	flex-direction: column;

	gap: 40px;

	flex: 1;
}

#golink .golink_box {
	border-radius: 40px;

	padding: 0 35px;

	position: relative;

	height: 150px;

	display: flex;

	align-items: center;

	justify-content: flex-start;
}

#golink .golink_box .golink_text {
	display: flex;

	flex-direction: column;

	gap: 8px;
}

#golink .golink_box .golink_text .golink_title {
	display: flex;

	align-items: center;

	gap: 10px;
}

#golink .golink_box .golink_text .golink_title .golink_icon {
	width: 40px;

	height: 40px;

	background-color: #fff;

	border-radius: 999px;

	display: flex;

	align-items: center;

	justify-content: center;
}

#golink .golink_box .golink_text .golink_title .golink_ti {
	font-size: 1.55rem;

	font-weight: 800;

	font-family: "SUITE";
}

#golink .golink_box .golink_text .golink_title .golink_co {
	font-size: 1.11rem;

	font-weight: 400;

	letter-spacing: -0.6px;

	line-height: 130%;
}

#golink .golink_box .more_btn {
	background-color: #fff;

	position: absolute;

	right: 0;

	bottom: 0;

	border-radius: 40px 0 0 0;

	padding: 15px 0 0 15px;
}

#golink .golink_box .more_btn div {
	width: 65px;

	height: 65px;

	background-color: #555;

	border-radius: 50%;

	display: flex;

	align-items: center;

	justify-content: center;
}

#golink .golink_box .more_btn::before,
#golink .golink_box .more_btn::after {
	content: "";

	width: 40px;

	height: 40px;

	position: absolute;

	background-repeat: no-repeat;

	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M40 40L0 40C0 40 17.3543 39.4457 28.4 28.4C39.4457 17.3543 40 0 40 0L40 40Z' fill='white'/%3E%3C/svg%3E");
}

#golink .golink_box .more_btn::before {
	right: 0;

	top: -40px;
}

#golink .golink_box .more_btn::after {
	left: -40px;

	bottom: 0;
}

#golink .golink_box01 {
	background-color: #ddf3ff;
}

#golink .golink_box01 .golink_text .golink_title .golink_ti span {
	color: #1a9bdf;
}

#golink .golink_box02 {
	background-color: #e7ecff;
}

#golink .golink_box02 .golink_text .golink_title .golink_ti span {
	color: #6a80d7;
}

#golink .golink_box:hover .more_btn svg {
	transform: translate3d(5px, 5px, 5px);

	transition: all 0.3s;
}

#direct {
	display: flex;

	align-items: stretch;

	gap: 40px;
}

#direct > div {
	flex: 1;
}

#direct .direct_box {
	border-radius: 20px;

	padding: 50px;

	display: flex;

	align-items: center;

	gap: 30px;

	background-repeat: no-repeat;

	background-position: right 45px bottom;

	background-size: 200px auto;

	transition: background-size 0.2s;
}

#direct .direct_box .direct_ti {
	font-size: 1.55rem;

	font-weight: 800;

	line-height: 150%;

	font-family: "SUITE";

	color: #222;
}

#direct .direct_box .direct_co {
	padding: 5px 15px;

	border-radius: 999px;

	font-size: 1rem;

	font-weight: 700;

	color: #fff;

	font-family: "SUITE";

	border-width: 2px;

	border-style: solid;
}

#direct .direct_box:hover {
	background-size: 210px auto;
}

#direct .direct_box01 {
	background-color: #ffebef;

	background-image: url(../img/main/direct_box01.png);
}

#direct .direct_box01 .direct_co {
	background-color: #ff7290;

	border-color: #ff7290;
}

#direct .direct_box01:hover .direct_co {
	background-color: #fff;

	color: #ff7290;
}

#direct .direct_box02 {
	background-color: #dcfcc1;

	background-image: url(../img/main/direct_box02.png);
}

#direct .direct_box02 .direct_co {
	background-color: #4aaa37;

	border-color: #4aaa37;
}

#direct .direct_box02:hover .direct_co {
	background-color: #fff;

	color: #4aaa37;
}

#section04 {
	background-image: url(../img/main/sec04_bg.png);

	background-repeat: no-repeat;

	background-position: right top 182px;

	position: relative;
}

#section04::before {
	content: "";

	width: 164px;

	height: 114px;

	background-image: url(../img/main/sec04_point_le.png);

	background-repeat: no-repeat;

	position: absolute;

	left: 33px;

	top: 135px;
}

#section04::after {
	content: "";

	width: 204px;

	height: 88px;

	background-image: url(../img/main/sec04_point_ri.png);

	background-repeat: no-repeat;

	position: absolute;

	right: 21px;

	top: 35px;
}

#section04 .mircenter {
	display: flex;

	flex-direction: column;

	gap: 100px;
}

#section04 .sec04 {
	display: flex;

	align-items: flex-end;

	gap: 40px;
}

#online {
	flex: 1;

	display: flex;

	flex-direction: column;

	gap: 60px;

	position: relative;
}

#online::before {
	content: "";

	width: 70px;

	height: 155px;

	background-image: url(../img/main/online_point_le.png);

	background-repeat: no-repeat;

	position: absolute;

	left: -45px;

	bottom: 0;
}

#online::after {
	content: "";

	width: 81px;

	height: 166px;

	background-image: url(../img/main/online_point_ri.png);

	background-repeat: no-repeat;

	position: absolute;

	right: -65px;

	bottom: 0;

	z-index: 1;
}

#online .online_text {
	display: flex;

	flex-direction: column;

	gap: 10px;
}

#online .online_text .online_ti {
	font-size: 2.22rem;

	font-weight: 800;

	font-family: "SUITE";
}

#online .online_text .online_ti span {
	color: #38a981;
}

#online .online_text .online_co {
	font-size: 1.11rem;

	font-weight: 400;

	line-height: 160%;

	letter-spacing: -0.6px;
}

#online .online_sns {
	display: flex;

	align-items: stretch;

	gap: 10px;
}

#online .online_sns a {
	flex: 1;

	height: 200px;

	border-radius: 40px;

	border-width: 10px;

	border-style: solid;

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: center;

	gap: 10px;
}

#online .online_sns .sns_ti {
	/*font-size: 1.33rem;*/
	font-size: 1.11rem;

	font-weight: 800;

	text-align: center;

	line-height: 175%;

	font-family: "SUITE";
}

#online .online_sns .kakao {
	border-color: #ffed87;

	background-color: #fdda45;
}

#online .online_sns .insta {
	border-color: #ebd9ff;

	background-color: #dcbcff;
}

#online .online_sns .youtube {
	border-color: #ffbfb7;

	background-color: #ff9c8f;
}

#online .online_sns .facebook {
	border-color: #b7dcff;
	background-color: #8fc3ff;
}

#online .online_sns a:hover {
	background-color: #fff;
}

#video {
	flex: 1;

	border: 1px solid #ddd;

	background-color: #fff;

	border-radius: 40px;

	padding: 30px;

	display: flex;

	flex-direction: column;

	gap: 30px;

	position: relative;
}

#video .video_ti {
	font-size: 1.22rem;

	font-weight: 500;

	line-height: 145%;

	letter-spacing: -0.66px;

	text-align: center;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis; /* 말줄임 적용 */
}

#video .video_box {
	width: 100%;

	height: 308px;
}

#video .video_box iframe {
	width: 100%;

	height: 100%;

	border-radius: 40px;
}

/* ********************** */

/* 반응형 미디어 쿼리 css */

@media (max-width: 1680px) {
	#section04::before {
		display: none;
	}

	#section04::after {
		display: none;
	}

	#section04 {
		background-image: none;
	}
}

@media (max-width: 1440px) {
	#news {
		max-width: 500px;
	}

	#food {
		width: 100%;

		flex: 1;
	}

	#information {
		width: 320px;
	}

	#using {
		width: 320px;
	}

	#notice {
		width: 430px;
	}

	#golink .golink_box .more_btn div {
		width: 50px;

		height: 50px;
	}

	#online::before {
		left: -30px;
	}
}

@media (max-width: 1200px) {
	#section02 .sec02 {
		flex-direction: column;

		gap: 80px;
	}

	#news {
		max-width: 600px;

		width: 60%;
	}

	#food {
		width: 40%;
	}

	#information {
		width: 100%;
	}

	#information .imformation_box {
		height: 160px;

		background-position: right 125px top 35px;
	}

	#information .imformation_box:hover {
		background-position: right 100px top 35px;
	}

	#information .imformation_box .information_text .information_co br {
		display: none;
	}

	#section03::before {
		height: 420px;
	}

	#section03 .sec03 {
		flex-direction: column;

		padding: 0;

		gap: 80px;
	}

	#section03 .sec03_wrap {
		width: 100%;
	}

	#using {
		width: 40%;
	}

	#notice {
		width: calc(60% - 40px);
	}

	#golink {
		flex-direction: row;

		width: 100%;
	}

	#golink .golink_box {
		flex: 1;
	}

	#direct .direct_box {
		background-position: right 30px bottom;
	}

	#section04 .sec04 {
		flex-direction: column;

		align-items: center;
	}

	#online {
		width: 100%;
	}

	#online::before {
		left: 20px;

		top: 0;
	}

	#online::after {
		right: 20px;

		top: 0;
	}

	#online .online_text {
		text-align: center;
	}

	#online .online_sns a {
		height: 200px;
	}

	#online .online_sns a svg {
		width: 60px;

		height: auto;
	}

	#video {
		width: 100%;
	}
}

@media (max-width: 1024px) {
	#index {
		gap: 80px;
	}

	#direct {
		flex-direction: column;
	}
}

@media (max-width: 991px) {
	.snow_wrap {
		display: none;
	}

	#visual .pc_bnn {
		display: none !important;
	}

	#visual .mo_bnn {
		display: block;
	}

	#visual .splide__pagination {
		bottom: 30px;
	}

	#visual .splide__pagination .splide__pagination__page {
		width: 15px;

		height: 15px;
	}

	#visual .splide__pagination .splide__pagination__page.is-active {
		width: 30px;
	}

	#using .using_box01 {
		background-size: 50px auto;

		background-position: right 20px top 20px;
	}

	#using .using_box02 {
		background-size: 35px auto;

		background-position: right 20px top 20px;
	}
}

@media (max-width: 768px) {
	#index {
		gap: 80px;
	}

	#section02 .sec02 .sec02_wrap {
		flex-direction: column;

		gap: 80px;
	}

	#news {
		width: 100%;

		max-width: 100%;
	}

	#food {
		width: 100%;
	}

	#information .imformation_box {
		height: 200px;

		background-size: 60px auto;

		background-position: right 35px top 25px;
	}

	#information .imformation_box:hover {
		background-position: right 25px top 25px;
	}

	#information .imformation_box .information_text .information_co br {
		display: block;
	}

	#section03::before {
		width: 100%;

		border-radius: 0;

		height: 58%;
	}

	#section03 .sec03_wrap {
		flex-direction: column;
	}

	#using {
		width: 100%;
	}

	#using .using_box .using_text {
		text-align: center;
	}

	#using .using_box01 {
		background-image: none;
	}

	#using .using_box02 {
		background-image: none;
	}

	#notice {
		width: 100%;
	}

	#golink {
		flex-direction: column;

		gap: 30px;
	}

	#golink .golink_box {
		padding: 30px 20px;

		justify-content: center;
	}

	#golink .golink_box .golink_text .golink_co {
		text-align: center;
	}

	#golink .golink_box .more_btn {
		display: none;
	}

	#direct .direct_box {
		flex-direction: column;

		align-items: flex-start;

		padding: 30px;

		gap: 10px;

		background-size: 140px auto;
	}

	#direct .direct_box:hover {
		background-size: 160px auto;
	}

	#online::before,
	#online::after {
		display: none;
	}
}

@media (max-width: 640px) {
	#notice {
		padding: 30px 15px;
	}

	#notice .notice_tab {
		flex-direction: column;

		gap: 20px;

		align-items: center;

		margin-top: 10px;
	}

	#section03 .mircenter {
		gap: 60px;
	}

	#online {
		gap: 40px;
	}

	#online .online_text .online_ti span {
		display: block;
	}

	#online .online_sns {
		flex-direction: column;
	}

	#online .online_sns a {
		height: auto;

		padding: 30px;

		flex-direction: row;

		gap: 30px;
	}

	#video {
		padding: 20px;

		border-radius: 30px;

		gap: 20px;
	}

	#video .video_box iframe {
		border-radius: 30px;
	}
}

@media (max-width: 480px) {
}