/*font*/
@font-face {
  font-family: 'Dellimun';
  src: url('../fonts/Dellimun.woff') format("woff"),
         url('../fonts/Dellimun.ttf') format("truetype"),
         url('../fonts/Dellimun.eot') format("embedded-opentype");
}

/*color*/
:root {
    --light: #d1eddc;
    --color2: #ffd875;

    --maincolorlight: #1ABCFE;
    --maincolor: #19398A;
    --maincolordark: #081E40;

    --color_orange: #EF4123;
    --color_orange-lighter: #DC5034;
    --color_orange2: #F58220;

    --color_purple: #C6168D;
    --color_purple-lighter: #FF57C9;

    --color_yellow: #ffe96c;

    --gray: rgba(255,255,255,.25);
    --dark: #081E40;
    --darkdark: #11181E;
}

html { overflow-x: hidden; background-color: var(--maincolordark);}
body { 
	font-family: 'Inter','Anek Bangla', Arial, sans-serif; font-weight: 400; font-size: 22px; line-height: 1.5; color: #fff; 
	margin: 0; overflow-x: hidden; width: 100%;
	background: url(../images/bg.webp) var(--darkdark) center repeat-y;
}
body * {
	/*-moz-user-select: none;	-webkit-user-select: none;
	-ms-user-select: none;	-khtml-user-select: none; user-select: none;*/
	user-drag: none; -webkit-user-drag: none;
	-webkit-touch-callout: none;
}
h1, h2, h3, h4, h5, h6 { font-family: 'Inter','Anek Bangla', Arial; font-weight: 600; letter-spacing: 0.5px;}
p, li { font-size: 22px; line-height: 1.5;}
a {	transition: all ease-out 0.25s; color: #fff;}
a:hover { transition: all ease-in 0.25s; color: var(--maincolorlight);}
.upperTxT { text-transform: uppercase;}
.flex-box {	display: flex; flex-wrap: wrap; justify-content: space-between;}

	.tp_SP-Fonts { font-family: 'Anek Bangla','Inter', Arial, sans-serif; }

.mc_title { color: var(--maincolor); text-transform: uppercase; font-size: 35px; line-height: 1.5; font-weight: 500; letter-spacing: 1px; }
.mc_title span { position: relative; display: inline-block;}
.mc_title span::after {
	content: ''; position: relative; display: block; width: 40px; height: 2px;
	background: var(--gray); left: calc(50% - 20px); margin: 10px 0;
}
	@media screen and (max-width: 1025px) {
		body, p ,li { font-size: 18px;}
	}
	@media screen and (max-width: 512px) {
		body, p ,li { font-size: 16px;}
	}
.main_button { color: var(--maincolorlight); border: 2px solid var(--maincolor); border-radius: 50px; padding: 10px 25px; text-decoration: none;}
.main_button:hover { background: var(--maincolor); color: var(--maincolordark); }

/**/
.box-item { width: 50%; }
.width_Lg { width: 75%; }
.width_Sm { width: 25%; }
.text-area { width: 85%; margin: 0 auto; text-align: left;}
.float_item { position: absolute; z-index: 0; background: no-repeat center center; background-size: contain;}
.overflow-hidden { overflow: hidden;}
.text_center { text-align: center; }
.mt_0 { margin-top: 0 !important; }
.mb_0 { margin-bottom: 0 !important; }
.pt_0 { padding-top: 0 !important; }
.pb_0 { padding-bottom: 0 !important; }

.clearfix:before, .clearfix:after { content: ''; display: table;}
	.clearfix:after { clear: both;}
	.clearfix { *zoom: 1;}

.list_none { padding: 0; margin: 0; list-style-type: none; }
.btn { 
	color: #fff; font-size: 20px; background-color: transparent; border: 2px solid #fff; border-radius: 50px; padding: 15px 35px; 
	cursor: pointer; transition: all ease 500ms; font-weight: bold; font-family: 'Anek Bangla', Arial; font-stretch: semi-expanded;
}
.btn:hover { 
	background-color: var(--maincolor); border-color: var(--maincolor); color: var(--maincolordark); transition: all ease 250ms;
}
.divider { margin: 50px 0; }

.remarks { line-height: 1.2; padding: 30px; border: 2px solid var(--maincolor); }
.remarks2 { position: relative; line-height: 1.2; padding: 10px 30px; margin: 15px 0; }
.remarks2 p { font-size: 16px; }
.remarks2::after { 
	content: ''; position: absolute; display: inline-block; width: 100%; height: 100%; 
	left: 0; top: 0; z-index: -1; border-left: 5px solid var(--color_orange);
}
.remarks3 { font-style: italic; }

.video { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; margin-bottom: 30px;}
.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

	@media screen and (max-width: 768px) {
		.btn { font-size: 16px; }
		.divider { margin: 20px 0; }
		.remarks2 { font-size: 14px; padding: 15px 25px; }
	}

/**/

#header-logo { 
	position: fixed; top: 0; left: 0; width: 100%; height: 50px; z-index: 999; background: var(--darkdark);
}
#header-logo img { max-width: 115px; padding-left: 1.15em; padding-top: 0.35em;}
	#content-wrapper { padding-top: 50px; }

#lang-box {	position: fixed; font-size: 14px; top: .75em; left: calc(140px + 1.5em); margin: 0 auto; z-index: 999; transition: all ease-in 0.25s;}
#lang-box .flex-box { flex-wrap: nowrap; }
#lang-box ul, #lang-box li { list-style: none; margin: 0 auto; padding: 0; font-size: inherit;}
#lang-box ul { padding-right: 3px;}
#lang-box ul::after { 
	content: ''; position: absolute; display: inline-block; width: 100%; height: 100%; left: 0; top: 0; 
	background: transparent; z-index: -1; border-radius: 50px;
}
#lang-box a { 
	display: inline-block; position: relative; text-transform: uppercase; text-decoration: none; 
	color: #fff; padding: 0 calc(13px + 16px) 0 13px; opacity: .7; line-height: 2;
}
	#lang-box li a::after { 
		content: ''; position: absolute; display: inline-block; width: 16px; height: 27px; right: 8px; 
		background-size: contain; background-repeat: no-repeat; background-position: center;
	}
	#lang-box li:first-child a::after  { background-image: url(../images/lang_bangladesh.webp); }
	#lang-box li:nth-child(2) a::after { background-image: url(../images/lang_english.webp); }

#lang-box a.active { color: #fff; font-weight: bold; opacity: 1;}
#lang-box a:hover {	opacity: 1;}
#lang-box a.active:hover { color: var(--color_orange); }
	#lang-box img { width: 18px; height: 12px; padding: 5px 0 0 5px; border-radius: 2px; -webkit-filter:saturate(0.75);}

div#content-wrapper { position: relative;}
.section { position: relative; width: 100%; font-size: 1.1em; }
.section .container {
	position: relative;	margin: 0 auto;	width: 1280px; align-items: center;	z-index: 1;
}
	@media screen and (max-width: 1380px) {
		.section .container { width: calc(100vw - 6vw); padding: 0 3vw; }
		.mc_title span { font-size: 30px; }
	}
	@media screen and (max-width: 768px) {
		.mc_title { margin: 10px 0; }
		.mc_title span { font-size: 28px; }
	}	


/*winner_list*/

:root {
	--list_spacing: 50px;
}

.end_tag { 
	position: absolute; left: 30px; top: -30px; padding: 0 15px; background: #ff3939;
	text-transform: uppercase; animation: updown 3s ease infinite;
}
	.end_tag::after { 
		content: ''; position: absolute; display: inline-block; right: 0; bottom: -10px;
		width: 0; height: 0; border-top: 12px solid #ff3939; border-left: 12px solid transparent; 
	}
	@keyframes updown {
		0%   { transform: translateY(0);}
		50%  { transform: translateY(-5px);}
		100% { transform: translateY(0);}
	}
.expired_tag { 
	position: absolute; display: inline-block; color: var(--color_orange); right: 0; top: 50%; transform: rotate(-15deg); z-index: 5;
	border-top: 1px solid var(--color_orange); border-bottom: 1px solid var(--color_orange); line-height: 1.25; letter-spacing: 0;
	text-align: right;
}
	.tabs-h > input:checked + label .expired_tag { color: var(--maincolor); border-color: var(--maincolor); }
	.section.rulebox .tp_title b { position: relative; display: inline-block; }
	.section.rulebox .tp_title b .expired_tag { 
		font-size: 25px; transform: scale(125%, 75%) rotate(-15deg); right: -3em; top: -20px;
		color: #fff!important; border-color: #fff; padding: 0 .5em;
	}

#announcement { position: relative; ;}
#announcement h5 { 
	color: #fff; font-size: calc(1em + 1.5vw); font-stretch: semi-expanded; line-height: 1.2; margin: 0; 
	font-weight: bolder; text-align: center; transform: translateY(20px);
	text-shadow: 0 -1px 15px var(--color_orange), -1px 0 1px #fff;
}
#announcement h5 span { font-weight: normal; }
#announcement .container { width: 100%!important; padding: 0; }
.winner_list { 
	background-color: rgba(0,0,0,.15); padding: 50px 30px 50px; box-sizing: border-box;
 	justify-content: center; gap: var(--list_spacing); text-align: center;
}
	.winner_list.col_2 ul { width: calc(50% - var(--list_spacing)/1.25); }
	.winner_list.col_3 ul { width: calc(33.3% - var(--list_spacing)/1.25); }
	.winner_list.col_4 ul { width: calc(25% - var(--list_spacing)/1.25); }
	.winner_list ul li { font-size: 18px; }

	@media screen and (max-width: 991px) {
		.winner_list { padding: 25px 15px 25px 20px; }
		.winner_list.col_4 ul { width: calc(50% - var(--list_spacing)/1.25); }
		#announcement h5 { font-size: 30px; margin-bottom: 10px;}
	}
	@media screen and (max-width: 768px) {
		:root {
			--list_spacing: 15px;
		}
		.winner_list { padding: 25px 15px 10px; }
		.winner_list ul li { font-size: 15px; line-height: 1.1; margin-bottom: 15px;}
		label .expired_tag { background: rgba(25,57,138,.75); }
		.tabs-h > input:checked + label .expired_tag { background: rgba(239,65,35,.5); box-shadow: 0 1px 15px var(--color_orange);}
	}
	@media screen and (max-width: 512px) {
		.end_tag { font-size: 12px; left: 10px;}
		.winner_list li { font-size: 13px; }
		.winner_list.col_2 ul,
		.winner_list.col_3 ul,
		.winner_list.col_4 ul { width: 100%; }
		.winner_list.aw_1, .winner_list.aw_2 { width: 100%; gap: 0; flex-direction: column; align-items: center;}
		.winner_list.aw_3, .winner_list.aw_4 { justify-content: space-between; gap: 0;}
		.winner_list.aw_3 ul, .winner_list.aw_4 ul { width: 49%; }
	}

/**/

.article p, .article a { color: #fff; }

#content-wrapper::after {
	content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0;
	background: url(../images/Banner.webp) no-repeat; background-position: center 50px; background-size: contain;
}

#logo { position: relative;}
	#logo .logo_group img { max-width: 100%; position: relative; z-index: 5; border-radius: 15px;}
	#logo .logo_group a { display: inline-block;}
	#logo .logo_group a + a { margin-left: 10px; }

.s1 { 
	position: relative; padding: 0; color: var(--darkdark); overflow: hidden; text-align: center; z-index: 9;
}
.s1 .main_banner { position: relative; z-index: 10; padding: 150px 0 10px; }
.s1 .tp_article { text-transform: uppercase; line-height: 0.8; margin: 0 auto; padding: 100px 0 0px; z-index: 20;}
.s1 .tp_article .tp_title h1 { 
	font-size: .1em; padding: 0; opacity: 0;
}
.s1 .tp_article img { max-width: 100%; }

.s1_coin { position: relative; z-index: 15; }
#s1_coin1 { 
	width: 282px; height: 142px; left: calc(50% - 850px); top: -5em; z-index: 1; 
	background-image: url(../images/s1_coin1.webp);
	animation: micro_movement ease-in-out 3s infinite;
}
#s1_coin2 { 
	width: 282px; height: 155px; right: 1vw; top: -250px; 
	background-image: url(../images/s1_coin2.webp); opacity: 1; transform: scale(.8);
}
	@media screen and (min-width: 840px) {
		.s1 .tp_article img { max-width: 800px; }
	}
	@media screen and (max-width: 1680px) {
		#s1_coin2 { width: 170px; height: 105px; }
	}
	@media screen and (max-width: 1199px) {
		.s1 .tp_article { padding: 50px 0 0px; }
		#s1_coin1 { width: 170px; height: 240px; left: 35px; }
		#s1_coin2 { top: -320px !important;}
	}
	@media screen and (max-width: 991px) {
		#content-wrapper::after { background-size: 140vw; }
		.s1 .main_banner { padding-top: calc(100px - 2vw); }
	}
	@media screen and (max-width: 640px) {
		#s1_coin1 { top: -150px; width: 100px; }
		#s1_coin2 { top: 200px !important;}
	}
	@media screen and (max-width: 480px) {
		.s1 .main_banner { padding-top: calc(100px - 15vw); }
	}

/**/

#wrap-body { position: relative; letter-spacing: 1px; background: transparent; padding-top: 30px; margin: 0 auto; width: 1280px; z-index: 10;}
	@media screen and (max-width: 1380px) {
		#wrap-body { width: 95%;}
	}
    .tabs-h {display:flex; flex-wrap: wrap; justify-content: center; position: relative; z-index: 3;}

    .tabs-h label {
    	position:relative; order:1; width:calc(99% / 4); padding: 0; margin: 0 auto; border: 0;
    	display: flex; align-items: center; justify-content: center;
    	background-color:transparent; margin-bottom:0; cursor:pointer; text-align:center; transition: all 500ms ease;
    }
    .tabs-h label > div {
    	font-size: calc(.65em + .25vw); font-weight:700; line-height:1.1; display: flex; align-items: center; justify-content: center;
    	padding:0; margin:0; color:#fff; width: calc(100% - 30px); background: var(--maincolor); position: relative; height: 80px;
    }
    .tabs-h label > div .tab_menu { text-align: left; }
    .tabs-h label > div .tab_date { text-align: left; font-weight: 400; font-size: 12px; letter-spacing: 0; padding: 5px 0; }
    .tabs-h label > div::before, .tabs-h label > div::after { 
    	content: ''; position: absolute; display: block; top: 0; left: -14px; width: 15px; height: 100%;
    	clip-path: polygon(0 0, 100% 0, 100% 100%, 90% 100%, 0 30%); background: var(--maincolor);
	}
		.tabs-h label > div::after { transform: scale(-1); left: auto; right: -14px; }
    .tabs-h label > div > i { display: block; width: 30px; height: 30px; padding-right: 15px; animation: updown 2.8s ease-in-out infinite; }
	    .tabs-h label[for="rules"] > div > i,
	    #side_menu li:first-child a .tab_icon { background: url(../images/tab1_icon.svg) no-repeat center; background-size: 25px; }
	    .tabs-h label[for="winneri"] > div > i,
	    .tabs-h label[for="winnerii"] > div > i,
	    #side_menu li:nth-child(2) a .tab_icon,
	    #side_menu li:nth-child(3) a .tab_icon { background: url(../images/tab2_icon.svg) no-repeat center; background-size: 25px; }
	    .tabs-h label[for="winneriii"] > div > i,
	    #side_menu li:nth-child(4) a .tab_icon { background: url(../images/tab3_icon.svg) no-repeat center; background-size: 25px; }

    .tabs-h .tab-content {position: relative; order:2; width:100%; padding:0; margin:0; display:none;}
    .tabs-h .tab-content > div {display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch;justify-content:center;border-radius: 30px;}
    .tabs-h .tab-content > .reverse-tab > .txt-tab {order:2}
    .tabs-h .txt-tab {
        padding:0;width:100%;min-height:300px;background: url(../images/bg_3.webp) no-repeat; 
        background-size: 30vw; background-position: calc(100% + 8vw) 60%;
    }

    .tabs-h > input {display:none}
    .tabs-h > input:checked + label {}
    .tabs-h > input:checked + label > img {filter:saturate(1)}
    .tabs-h > input:checked + label > div,
    .tabs-h > input:checked + label > div::before, .tabs-h > input:checked + label > div::after { background: var(--color_orange);}
    .tabs-h > input:checked + label[for="rules"] > div > span { background-image: url(../images/tab1_color.svg); }
    .tabs-h > input:checked + label[for="ranked"] > div > span { background-image: url(../images/tab2_color.svg); }
    .tabs-h > input:checked + label + .tab-content {display:block}

    @media (max-width: 991px) {
    	.tabs-h label { font-size: 1.15em; letter-spacing: 0; width:calc(99% / 2); margin-bottom: 5px; }
    	.tabs-h label > div .tab_date { font-size: 10px; }
    }

.tp_content { padding: 50px 2.5vw; margin: 30px 0 40px; position: relative; box-sizing: border-box; }
	.tp_content::before, .tp_content::after { 
		content: ''; position: absolute; display: block; top: -22px; left: 0; width: 120px; height: 23px;
		clip-path: polygon(0 0, 75% 0, 100% 100%, 0% 100%);
	}
	.tp_content::after { 
		transform: scale(-1); left: auto; top: auto; right: 0; bottom: -22px;
	}
		.tp_content.border::before { left: -1px; top: -23px; } .tp_content.border::after { right: -1px; bottom: -23px; }
		.tp_content.intro::before, .tp_content.intro::after { background: var(--color_orange); }
		.tp_content::after { background: var(--maincolordark);}

.tp_content.intro { position: relative; border: 1px solid var(--color_orange); background: var(--darkdark); }
.tp_content.intro .tp_title { font-size: calc(1em + 1.5vw); font-weight: bolder; line-height: 1.2; }
.tp_content.intro .tp_title span { color: var(--color_orange-lighter); }

.tp_content.rulebox .tp_title.tp_SP-Fonts { 
	transform: scale(75%, 125%); font-weight: 700; font-size: calc(2em + 1.75vw); margin: 20px 0 50px;
	letter-spacing: 2px; line-height: 1; text-transform: uppercase;
}
	@media screen and (max-width: 991px) {
		.tp_content { padding: 20px; }
	}

	/* area color system */
	#LD_1 { background: linear-gradient(to bottom, var(--color_orange) 0%, var(--maincolordark) 350px, var(--maincolordark) 100%) }
	#LD_1 .tp_title.tp_SP-Fonts { text-shadow: 0 -2px 1px var(--color_orange), -1px 0 1px #fff; }
	#LD_1 .tp_title span { color: var(--maincolordark); text-shadow: 0 -2px 1px var(--color_orange), -1px 0 1px var(--maincolordark); }
	#LD_1 .tp_award-des, #LD_1 .remarks3 { color: var(--color_orange); }
	#LD_1::before { background: var(--color_orange); }

	#LD_2 { background: linear-gradient(to bottom, var(--maincolorlight) 0%, var(--maincolordark) 350px, var(--maincolordark) 100%) }
	#LD_2 .tp_title.tp_SP-Fonts { text-shadow: 0 -2px 1px var(--maincolorlight), -1px 0 1px #fff; }
	#LD_2 .tp_title span { color: var(--maincolordark); text-shadow: 0 -2px 1px var(--maincolorlight), -1px 0 1px var(--maincolordark); }
	#LD_2 .tp_award-desc, #LD_2 .remarks3 { color: var(--maincolorlight); }
	#LD_2::before { background: var(--maincolorlight); }

	#LD_3 { background: linear-gradient(to bottom, var(--color_orange2) 0%, var(--maincolordark) 350px, var(--maincolordark) 100%) }
	#LD_3 .tp_title.tp_SP-Fonts { text-shadow: 0 -2px 1px var(--color_orange2), -1px 0 1px #fff; }
	#LD_3 .tp_title span { color: var(--maincolordark); text-shadow: 0 -2px 1px var(--color_orange2), -1px 0 1px var(--maincolordark); }
	#LD_3 .tp_award-desc, #LD_3 .remarks3 { color: var(--color_orange2); }
	#LD_3::before { background: var(--color_orange2); }

	#LD_4 { background: linear-gradient(to bottom, var(--color_purple) 0%, var(--maincolordark) 350px, var(--maincolordark) 100%) }
	#LD_4 .tp_title.tp_SP-Fonts { text-shadow: 0 -2px 1px var(--color_purple-lighter), -1px 0 1px #fff; }
	#LD_4 .tp_title span { 
		display: block; color: var(--color_yellow); text-shadow: 0 -2px 1px var(--color_purple-lighter), -1px 0 1px var(--maincolordark);
	}
	#LD_4 .tp_award-desc, #LD_4 .remarks3 { color: var(--color_purple-lighter); }
	#LD_4::before { background: var(--color_purple); }

/* award */
.section .tp_award li img { width: 100%; }
.section .tp_award li { display: grid; position: relative; margin-bottom: 5px; justify-content: center; }

.section .tp_award { display: grid; gap: 15px; }
	.section .tp_award.item_4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.section .tp_award.item_3 { grid-template-columns: repeat(3, minmax(0, 1fr));  }

	.tp_sparkling { position: relative; }
		.tp_sparkling::before, .tp_sparkling::after,
		#LD_4 .tp_award li:first-child .tp_award-figue::before,
		#LD_4 .tp_award li:first-child .tp_award-figue::after,
		#LD_4 .tp_award li:first-child .tp_award-desc::after  { content: ''; position: absolute; z-index: 1;}
		.tp_sparkling::before {  background: url(../images/sparkling1.webp); width: 32px; height: 32px;left: 50px; bottom: 50px;  background-size: contain;}
		.tp_sparkling::after  {  background: url(../images/sparkling2.webp); width: 50px; height: 50px; left: 20px; bottom: 20px;  background-size: contain;}
		#LD_4 .tp_award li:first-child .tp_award-figue::before { 
			background: url(../images/sparkling2.webp); width: 35px; height: 35px; right: 50px; top: 30px;  background-size: contain;
		}
		#LD_4 .tp_award li:first-child .tp_award-figue::after { 
			background: url(../images/sparkling3.webp); width: 42px; height: 42px; right: 10px; bottom: 150px; background-size: contain;
		}
		#LD_4 .tp_award li:first-child .tp_award-desc::after { 
			background: url(../images/sparkling1.webp); width: 50px; height: 50px; right: 150px; top: 100px;  background-size: contain;
		}
	@media screen and (min-width: 1100px) {
			.section .tp_award.item_3 { padding: 0 7vw;}
	}
		@media screen and (max-width: 991px) {
			.section .tp_award.item_4 { grid-template-columns: repeat(2, minmax(0, 1fr));}
		}
		@media screen and (max-width: 768px) {
			.section .tp_award.item_3 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: 10px; }
			.section .tp_award.item_3 li:first-child { grid-row: 1; grid-column: 1 / span 2;}
			.section .tp_award.item_3 li:nth-child(2),
			.section .tp_award.item_3 li:nth-child(3) { grid-row: 2; grid-column: auto;}
		}
		@media screen and (max-width: 480px) {
			.section .tp_award.item_4 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto auto; gap: 10px; }
			.section .tp_award.item_4 li:first-child { grid-row: 1; grid-column: 1 / span 2;}
			.section .tp_award.item_4 li:nth-child(2) { grid-row: 2; grid-column: 1 / span 2;}
			.section .tp_award.item_4 li:nth-child(3),
			.section .tp_award.item_4 li:nth-child(4) { grid-row: 3; grid-column: auto;
			}
			.section .tp_award li img { max-width: 230px; }
			.tp_sparkling::after { left: -25px; }
		}

.section .tp_award .tp_award-desc { 
	position: relative; z-index: 1;
	margin: 0; font-weight: bolder; font-size: calc(1.25em + .25vw); line-height: .8; margin-bottom: -2px;
}
.section .tp_award .tp_award-title { text-align: center; font-weight: 300; line-height: 1.15; margin-top: 10px; }

.section .tp_date li { 
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75em;
	font-size: calc(1.5em + .25vw); font-weight: 500; line-height: 1.1; letter-spacing: 1px; transform: scale(80%, 110%);
}
.section .tp_date li:first-child { margin-bottom: 25px; }
.section .tp_date li div:first-child { text-align: right; text-transform: uppercase; }
.section .tp_date li span { position: relative; display: inline-block; padding: 2px 20px; z-index: 1; }
	.section .tp_date li span::after { 
		content: ''; position: absolute; display: block; background: var(--maincolor);
		width: 100%; height: 100%; left: 0; top: 0; z-index: -1; transform: skew(10deg);
	}

	@media screen and (max-width: 991px) {
		.section .tp_date li { grid-template-columns: 1fr; gap: 5px; }
		.section .tp_date li div { text-align: center!important; }
	}
	@media screen and (max-width: 640px) {
		.section .tp_date li { font-size: 1.25em; }
	}


.tp_content-title { 
	font-size: 2.2em; font-weight: 700; margin: 1.25em 0 .75em;
	text-align: center; line-height: 1; letter-spacing: 2px; text-transform: uppercase;
}
.tp_content-title span { position: relative; display: inline-block; transform: scale(80%, 110%); }
	.tp_content-title span::before, .tp_content-title span::after {
		content: ''; position: absolute; display: inline-block; width: 153px; height: 87px;
		background-size: cover; z-index: -1; transform: scale(120%, 90%);
	}
	.tp_content-title span::before { background: url(../images/title_decorate-left.webp) center no-repeat; left: -110px; top: -35px; }
	.tp_content-title span::after  { background: url(../images/title_decorate-right.webp) center no-repeat; right: -110px; bottom: -35px; }

.fillform a { 
	position: relative; display: inline-block; background: var(--color_purple-lighter); border-radius: 50px;
	padding: 10px 50px 10px 100px; text-decoration: none; z-index: 1;
}
	.fillform a::after { 
		content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0;
		background: var(--color_purple-lighter); border-radius: 50px; z-index: -1;
		animation: btn_grow 2s ease infinite;
	 }
	 @keyframes btn_grow {
	 	0%   { transform: scale(1); opacity: 1; }
	 	90% { transform: scale(1.1, 1.35); opacity: 0; }
	 	100% { transform: scale(1.1, 1.35); opacity: 0; }
	 }
.fillform a span { position: relative; }
	.fillform a span::before { 
		content: ''; position: absolute; width: 68px; height: 90px; left: -75px; top: -35px;
		background: url(../images/icon_form.webp) no-repeat center; background-size: contain;
		animation: updown 2.5s ease-in-out infinite;
	}


.tp_content.final::before, .tp_content.final::after { background: var(--maincolor); }

.tp_content.final { position: relative; border: 1px solid var(--maincolor); background: var(--darkdark); }
.tp_content.final .tp_title { 
	transform: scale(75%, 125%); font-size: calc(2em + 1.75vw); text-transform: uppercase; margin: 20px 0 50px;
}
.tp_content.final .tp_title span { position: relative; display: inline-block; }
	.tp_content.final .tp_title span::after {
		content: ''; width: calc(100% + 2px); height: calc(100% - 65px); left: -1px; bottom: 15px; position: absolute;
		background-color: var(--maincolor); z-index: -1;
	}
.tp_content.final .tp_title span b { position: relative; display: inline-block; }
	.tp_content.final .tp_title span b::before, .tp_content.final .tp_title span b::after {
		content: ''; position: absolute; width: 30px; height: calc(100% - 65px); bottom: 15px;
    	clip-path: polygon(0 0, 100% 0, 100% 100%, 90% 100%, 0 30%); background: var(--maincolor);
	}
	.tp_content.final .tp_title span b::before { left: -30px; }
	.tp_content.final .tp_title span b::after { right: -30px; transform: scale(-1); }

.tp_content.final .tp_alliance { 
	display: grid; padding: 30px; margin: 0 auto; width: 80%; border-radius: 90px;
	grid-template-columns: repeat(5, minmax(0, 1fr)); box-sizing: border-box;
	align-items: center; justify-content:center; border: 2px solid; animation: color_gradient linear 2s infinite;
}
	.tp_alliance a { display: inline-block; }
	.tp_alliance a:hover { transform: translateY(-3px); }
	.tp_alliance a img { max-width: 100%; }

	@keyframes color_gradient {
		0%   { border-color: var(--maincolor); }
		20% { border-color: var(--maincolorlight); }
		60%  { border-color: var(--darkdark); }
		100% { border-color: var(--maincolor); }
	}

	@media screen and (max-width: 768px) {
		.tp_alliance a { margin: 0 5px; }
		.tp_content.final .tp_alliance {
			width: 100%; border-radius: 20px; grid-template-columns: 1fr;
		}
		.tp_content.final .tp_alliance a img { max-height: 45px; }
	}


	.fadeIn { opacity: .1; top: 100px; }

	.modal {
	  display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%;
	  background: rgba(0, 0, 0, 0.5);
	  justify-content: center; align-items: center; z-index: 80;
	}

	.modal-content {
	  background: var(--maincolordark); letter-spacing: 0;
	  padding: 50px 5vw; border-radius: 10px; text-align: center; position: relative; width: 300px;
	}

	.close {
	  position: absolute; top: 10px; right: 15px; font-size: 30px; cursor: pointer;
	}

/**/


footer { 
	position: relative; padding: 100px 0 0; z-index: 20;
	background: linear-gradient(to bottom, var(--maincolordark) 0%, var(--maincolor) 100%);
}
footer ul { 
	display: flex; justify-content: center; align-content: center; align-items: center; list-style-type: none;
	margin-bottom: 100px; padding: 0 5vw;
}
footer .tp_alliance a { margin: 0 auto;}
footer .tp_alliance li:nth-child(2) { position: relative; display: grid; gap: 0;
	grid-template-columns: repeat(5, minmax(0, 1fr)); box-sizing: border-box; align-items: center; justify-content:center;
}
footer .tp_alliance li:first-child { padding-right: 17px; }
footer .tp_alliance li:nth-child(2)::before {
	content: ''; position: absolute; display: inline-block; width: 1px; height: 30px; left: 0; top: 8px; background: var(--gray);
}
footer .tp_alliance a img { max-height: 50px; }

footer .copyright { position: relative; font-size: 16px; font-weight: 300; letter-spacing: 1px; color: #fff;}
footer .copyright::after { content: ''; position: absolute; width: 100%; height: 9px; left: 0; bottom: 0; background: var(--maincolordark);}
footer .copyright::before { content: ''; position: absolute; width: 100%; height: 10px; left: 0; bottom: 0; background: rgba(255,255,255,.25)}
footer .copyright span { 
	position: relative; display: inline-block; background: var(--maincolordark); padding: 10px;
	box-shadow: 0 -1px 0 rgba(255,255,255,.25);
}
footer .copyright span::before, footer .copyright span::after {
	content: ''; position: absolute; width: 80px; height: 100%; bottom: 0;
	clip-path: polygon(100% 0, 0% 100%, 100% 100%); background: var(--maincolordark);
}
	footer .copyright span::before { left: -79px; }
	footer .copyright span::after  { right: -79px; transform: scaleX(-1); }

	@media screen and (max-width: 991px) {
		footer { padding: 0 0 80px 0; }
		footer ul { padding: 50px 10px; margin: 0; }
		footer .tp_alliance a { display: block; }
		footer .tp_alliance li:nth-child(2)::before { top: calc(50% - 18px); }
	}
	@media screen and (max-width: 480px) {
		footer .tp_alliance a { margin: 0; }
		footer .tp_alliance a img { max-height: 30px; }
		footer .tp_alliance li { width: 130px; }
		footer .tp_alliance li:nth-child(2) { grid-template-columns: 1fr;
		}
		footer .tp_alliance li:first-child { padding-right: 10px; }
		footer .tp_alliance li:nth-child(2) { padding-left: 6px; }
		footer img, footer .tp_alliance li:nth-child(2) a img { max-height: 35px; }
		footer div + div { font-size: 14px; }
	}


/*fixed*/
#side_menu {
	position: fixed; right: 0; top: 50%; width: 95px; transform: translateY(-50%);
	border: 1px solid var(--maincolor); border-right: 0; box-sizing: border-box;
	opacity: 0; visibility:hidden; transition: opacity 300ms ease; z-index: 55;
}
#side_menu ul { 
	display: grid; align-items: center; justify-content: center; background: var(--dark); overflow: hidden;
}
#side_menu ul li a { 
	display: block; padding: 15px 10px; background: var(--dark); color: #fff;
	text-decoration: none; font-size: 14px; line-height: 1; text-align: center; box-sizing: border-box;
}
#side_menu ul li a .tab_icon { display: block; width: 30px; height: 30px; padding-right: 15px; margin: 0 auto 5px; }
#side_menu ul li.checked a {
	background: linear-gradient(to top right, var(--maincolor) 0%, var(--color_orange) 100%);
}

#side_menu.show { opacity: 1; visibility: visible;}
#side_menu ul li:last-child a .tab_icon { background: url(../images/arrow.svg) no-repeat center; background-size: 20px; }
#side_menu ul li:last-child a { cursor: pointer; }
	
	@media screen and (min-width: 992px) {
		#side_menu ul li:not(:first-child) a { border-top: 1px solid var(--maincolor); }
		#side_menu ul li a:hover { 
			background: linear-gradient(to top right, var(--maincolor) 0%, var(--maincolorlight) 100%);
		}
	}
	@media screen and (max-width: 991px) {
		#side_menu { height: 80px; top: auto; bottom: 0; width: 100%; transform: inherit; border-left: 0; border-bottom: 0; }
		#side_menu ul { grid-template-columns: repeat(4, minmax(0, 1fr)); height: 100%; }
		#side_menu ul li { height: 100%; }
		#side_menu ul li:not(:first-child) { border-left: 1px solid var(--maincolor); }
		#side_menu ul li a { 
			display: flex; flex-direction: column; font-size: 12.5px; padding: 0 2px; height: 100%; justify-content: center;
		}
		#side_menu ul li:last-child { position: fixed; right: 10px; bottom: 110px; height: 50px; border: 0;}
		#side_menu ul li:last-child a { font-size: 10px; border: 0; border-radius: 30px;}
		#side_menu ul li:last-child a .tab_icon { background-size: 15px; width: 20px; height: 20px; margin: 0 auto; padding: 0; }
	}



/**/
/*notice2*/
.notice2.tp_content.intro::before, .notice2.tp_content.intro::after { background: var(--maincolorlight); }
#announcement .notice2 h5 { text-shadow: 0 -1px 15px var(--maincolorlight), -1px 0 1px #fff; }
.notice2.tp_content.intro,
.notice2 .remarks2::after { border-color: var(--maincolorlight); }
.notice2.tp_content.intro .tp_title span { color: var(--maincolorlight); }

/**/
/*notice3*/
.notice3.tp_content.intro::before, .notice3.tp_content.intro::after { background: var(--color_purple-lighter); }
#announcement .notice3 h5.color_orange { text-shadow: 0 -1px 15px var(--color_orange2), -1px 0 1px #fff; }
#announcement .notice3 h5.color_purple { text-shadow: 0 -1px 15px var(--color_purple-lighter), -1px 0 1px #fff; }
.notice3.tp_content.intro { border-color: var(--color_purple-lighter); }
.notice3 .remarks2.color_orange::after { border-color: var(--color_orange2); }
.notice3 .remarks2.color_purple::after { border-color: var(--color_purple-lighter); }
.notice3 h4 { position: relative; text-align: center; font-size: 40px; line-height: 1.25; margin: 1.5em 0 0; }
.notice3 h4 span { position: relative; z-index: 1; display: inline-block; padding: 0 20px; background: var(--darkdark);}
.notice3 h4::after { 
	content: ''; position: absolute; width: 100%; height: 1px; left: 0%; top: 50%;
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 20%, #fff 80%, rgba(255,255,255,0) 100%);
}
	@media screen and (max-width: 991px) {
		.notice3 h4 { font-size: 25px; }
		.notice3 h4 span { max-width: 50%; }
	}