@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=Bai+Jamjuree:wght@300;400;500;600;700&family=Roboto:wght@400;700&display=swap');
*, *::before, *::after {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, input, select, textarea, button, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, header, footer, hgroup, menu, nav, output, 
ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; vertical-align: baseline; border: 0;}
article, aside, hgroup, header, footer, figure, figcaption, nav, section,time, mark, canvas, video, audio, details, summary {display: block;}

html {
/* Prevent font scaling in landscape */
-webkit-text-size-adjust: none; /*Chrome, Safari, newer versions of Opera*/
-moz-text-size-adjust: none; /*Firefox*/
-ms-text-size-adjust: none; /*Ie*/
-o-text-size-adjust: none; /*old versions of Opera*/
}

html {width: 100%; height: 100%; font-size: 62.5%; scroll-behavior: smooth;}
body {width: 100%; height: 100%; font-size: 1.4rem; color: #000; font-weight: 400; line-height: 1; text-align: center; font-family: 'Bai Jamjuree', sans-serif; background:#000;}
menu, ol, ul, li {list-style: none; list-style-image: none; vertical-align: top;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: none;}
table {table-layout: fixed; word-break: break-all; white-space: pre-wrap; border-collapse: collapse; border-spacing: 0;}
table caption {display: none;}
ul {font-size: 0;}
li {font-size: 1.6rem; letter-spacing: 0;}
img {line-height: inherit; vertical-align: top; -ms-interpolation-mode: bicubic !important;}
h1, h2, h3, h4, h5, h6 {color: #fff; font-weight: 700; font-style: italic; font-family: 'Bai Jamjuree';}
a {color: #fff; font-weight: 400; text-decoration: none; font-family: 'Bai Jamjuree'; display: inline-block; outline: none; cursor: pointer;}
a:focus {outline: none;}

.mobile {display:none;}

.inner {max-width:1540px; margin-left:auto; margin-right:auto;}
.dst {display:table; width:100%; height:100%;}
.dstc {display:table-cell; vertical-align: middle;}

.container {overflow:hidden; background:; position:relative;}
.all_wrap {overflow:hidden;}
.all_wrap > div {position:relative; padding-bottom:16rem; background-size:cover;}

	
header { text-align:left; position:absolute; top:0; left:0; right:0;  z-index: 20; padding:5rem 3rem 0;}
header .bi.m {display:none;}
header .bi img {max-width:202px;}
header .btn_today {background-repeat:no-repeat; background-position:0 0; background-image:url('/images/ph/event/2023/military/bg_today.png'); text-align:left; padding-left:2.4rem; width:259px; height:65px; line-height:63px; position:absolute; top:3.8rem; right:3rem; font-size: 14px; font-weight:500; color: #000;  letter-spacing: 0; text-transform:uppercase; display:block;}
header .btn_today i {  background-image:url('/images/ph/event/2023/military/icon_close.png'); display:inline-block; vertical-align:middle; position:relative; top:-2px; margin-right:0.8rem; width:25px; height:26px; background-repeat:no-repeat; background-position:0 0;}
header .btn_today:hover { background-position:0 -65px; color:#fff;}
header .btn_today:hover i {background-position:0 -26px;}

.all_wrap > .section01 {padding-bottom:12.6rem;}
.section01 {overflow:hidden;  border-bottom:1px solid #bcc5a0; z-index:1; position:relative; text-align:center;  background:url('/images/ph/event/2023/military/bg_section01.jpg') center 0 no-repeat; background-size:cover; }
.section01 .title_wrap {position:relative;}
.section01 .title_wrap .title {padding:12rem 0; display:inline-block; position:relative;}
.section01 .title_wrap .title .obj {position:absolute; }
.section01 .title_wrap .title .bull {top:364px; opacity:0; animation-fill-mode: forwards !important;}
.section01 .title_wrap .title .bull_left {left:-8rem; animation:fadeInRight 0.2s 0.2s;}
.section01 .title_wrap .title .bull_right {right:-8rem; animation:fadeInLeft 0.2s 0.2s;}
.section01 .title_wrap .title .tit {animation-duration:0.7s; animation-delay:0.5s;}
.section01 .circle {top:7.7rem; left:0;  transition: transform 1s linear; position:absolute; opacity:0;  }
.section01 .circle.stop { left:50%; animation: spin 0.5s linear; transform:translate(-50% , 0);}
.section01 .title_wrap .title .tit {position:relative;}
.section01 .title_wrap .title img {max-width:100%;}
.fadeInUp {animation-duration:0.5s;}
.section01 .title_wrap .sub_tit ul {font-size:0;}
.section01 .title_wrap .sub_tit ul li {font-family: 'Alfa Slab One'; margin:0 1.8rem; padding-top:3.4rem; width:350px; height:91px; background:url('/images/ph/event/2023/military/bg_sub_title.png') 0 0 no-repeat; text-shadow:0 0.3rem 0 rgba(0, 0, 0, 0.5);; display:inline-block; vertical-align:top;  font-size:28px; color:#fff; text-transform:uppercase;}
.section01 .title_wrap .sub_tit ul li span {color:#f9eb4f;}
.section01 .title_wrap .txt {margin-top:2.2rem; text-shadow:0 0.3rem 0 rgba(0, 0, 0, 0.5);color:#fff; font-size:22px; font-weight:700; text-transform:uppercase; letter-spacing:0.03rem; line-height:normal;}
.section01 .title_wrap .date {margin-top:2.4rem; color:#fff151; font-size:18px; text-shadow:0 0.3rem 0 rgba(0, 0, 0, 0.5);font-weight:600; letter-spacing:0.2rem; text-transform:uppercase;}
.section01 .explan {margin-top:10rem; font-size:0; position: relative; z-index:11;}
.section01 .explan > div {display:inline-block; text-shadow: 0 0 5px rgba(0, 0, 0, 0.4); vertical-align:middle; width:calc(50% - 17.5rem); }
.section01 .explan .con {max-width:580px; text-align:left;}
.section01 .explan .about {color:#fff;  margin-right:17.5rem; text-align:right;}
.section01 .explan .about .tit {font-family: 'Alfa Slab One'; text-transform:uppercase; font-size:40px; line-height:1.1; letter-spacing:0.2rem;}
.section01 .explan .about .tit span {color:#ff4642;}
.section01 .explan .about .txt {margin-top:-1rem; line-height: normal; height:115px; background:url('/images/ph/event/2023/military/bg_pass_free.png') right 0 center no-repeat; font-size:14px; font-weight:500; letter-spacing:0.02rem;  text-align:right;}
.section01 .explan .about .txt .con {position:relative; top:53%; transform:translate(0 , -50%);}
.section01 .explan .about .con {margin-right: 0;  margin-left: auto;}
.section01 .explan .pass {margin-left:17.5rem; color:#fff; text-align:left; padding-left:12rem; background:url('/images/ph/event/2023/military/bg_pass_premium.png') 0 0 no-repeat; height:429px;}
.section01 .explan .pass .tit {font-family: 'Alfa Slab One'; letter-spacing:0.2rem; text-transform:uppercase; font-size:30px;}
.section01 .explan .pass .tit img { position:relative; top:-2px; margin-left:0.7rem;}
.section01 .explan .pass .tit span { font-size:14px; color:#fff151; font-weight:700; letter-spacing:0; font-family: 'Bai Jamjuree'; display:block; margin-top:7px;}
.section01 .explan .pass .txt {font-size:14px; font-weight:500; letter-spacing:0.02rem;  color:#fff; line-height: normal; margin-top:1.5rem;}
.section01 .explan .pass .premium {margin-top:6.8rem;}
.section01 .explan .pass .premium .tit {color:#ff4642;}
.section01 .explan .pass .con {position:relative; top:50%; transform:translate(0 , -50%);}
.section01 .cha {position:absolute; top:0;}
.section01 .cha01 {left:-10.4%;}
.section01 .cha02 {right:-9.3%; animation-duration:0.3s;  animation-delay:0.2s;}
.fog { z-index: 1; position: absolute; height:640px; bottom: 0;  width: 400em; background: url('/images/ph/event/2023/military/fog.png') 0 0 repeat; animation: cloudLoop 80s linear infinite;}


.section02 {position:relative; background:url('/images/ph/event/2023/military/bg_section02.jpg') center 0 no-repeat; border-bottom:1px solid #787881;}
.section02 .conf {max-width:100%; position:absolute; top:-40%; left:0; right:0; z-index:1; animation:kk 0.5s cubic-bezier(0.29, 0.54, 0, 1.2); opacity:0; animation-fill-mode: forwards;}
.section02:before { content:''; display:block; position:absolute; top:0; left:0; bottom:0; right:0; background:url('/images/ph/event/2023/military/ptn_line.png') 0 0 repeat;}
.section02 .inner {position:relative; z-index:5; max-width:1700px;}
.section02 .swiper-container {padding:0 2px;}
.item_wrap {position:relative; padding:0 6rem; margin-top:3rem; animation-duration: 1s; z-index:4;}
.item_wrap .swiper-container {padding-bottom:7.2rem;}
.item_wrap .swiper-button-next, .item_wrap .swiper-button-prev {background-size:61px auto !important; margin-top:0;  top:50%; transform:translate(0 , -50%); font-size:0; display:block !important; height:74px;  background-color:rgba(255, 255, 255, 0); width:61px; background-repeat:no-repeat; background-position:0 0; position:absolute; cursor:pointer;}
.item_wrap .swiper-button-prev {left:0; background-image:url('/images/ph/event/2023/military/arr_l.png');}
.item_wrap .swiper-button-next {right:-2rem; background-image:url('/images/ph/event/2023/military/arr_r.png');}
.item_wrap .swiper-button-next:hover, .item_wrap .swiper-button-prev:hover  {background-position:0 -74px;}
.item_wrap .swiper-container-horizontal>.swiper-scrollbar {display:none; overflow: visible; border-radius:0; background:rgba(0, 0, 0, 0.5); bottom:0; height:3rem; border-top:1px solid #fff; border-bottom:1px solid #fff; padding:.4rem 0.2rem;  margin-right:2px; left:20%; width:59%;}
.item_wrap .swiper-button-next:after, .item_wrap .swiper-button-prev:after {display:none; }
.item_wrap .swiper-scrollbar-drag {background: #f3e650; border-radius:0;}
.item_wrap .swiper-pagination {bottom:0;}
.item_wrap .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {font-family:'Roboto'; font-weight:700; opacity:1; border-radius:0; width:50px; height:31px; background:rgba(255, 255, 255, 0); font-size:12px; font-weight:700; color:#fff; line-height:29px; border:1px solid #fff; border-left:0; border-right:0; margin:0 1rem;}
.item_wrap .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet i {margin:0 4px 0 2px;}
.item_wrap .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active {border-color:#f3e650; color:#f3e650; background:#000;}

.item_wrap .item_list {    margin-left: -1px;}
.item_wrap .item_list li {width:20%; padding-left:2rem; position:relative;}
.item_wrap .item_list li .bg {margin-top:1rem; border:1px solid #fff151; background:url('/images/ph/event/2023/military/ptn01.png') 0 0 repeat; padding:0.8rem 1rem 2.8rem 0; margin-left:1rem;}
.item_wrap .item_list li .con {position:relative; text-align:center; background:#f3e650; border:1px solid #fff151; margin-left:-1rem; padding:0 2.2rem 4.5rem 2rem;}
.item_wrap .item_list li .con:before, .item_wrap .item_list li .con:after {content:''; display:block; position:absolute; height:19px; left:-1px; right:-1px; }
.item_wrap .item_list li .con:before {top:-19px; background:url('/images/ph/event/2023/military/item_top.png') 0 0 no-repeat;}
.item_wrap .item_list li .con:after {bottom:-19px;  background:url('/images/ph/event/2023/military/item_bottom.png') right 0 no-repeat;}
.item_wrap .item_list li .con .level {padding-top:1rem; position:relative; color:#000; font-size:20px; text-transform:uppercase; letter-spacing:0.05rem; text-align:left; font-family: 'Alfa Slab One';}
.item_wrap .item_list li .con .item_box {position:relative; margin-top:3rem; background:rgba(0, 0, 0, 0.6); border:1px solid #fff; }
.item_wrap .item_list li .con .item_box:before {content:''; display:block; position:absolute; width:100%; height:100%; top:5px; left:5px; background:rgba(0, 0, 0, 0.2);}
.item_wrap .item_list li .con .item_box:after {content:''; display:block; position:absolute; top:5px; left:5px; right:5px; bottom:5px; background:url('/images/ph/event/2023/military/bkw_rt.png') right 0 no-repeat, url('/images/ph/event/2023/military/bkw_lb.png') 0 bottom no-repeat, url('/images/ph/event/2023/military/bkw_rb.png') right bottom no-repeat;}

.item_wrap .item_list li .con .item_box .item {padding:4.7rem 4.2rem 3.2rem;}
.item_wrap .item_list li .con .item_box > div {position:relative;}
.item_wrap .item_list li .con .item .pic {margin:0 auto; text-align:center; border:0.3rem solid #fff;     display: inline-block;}
.item_wrap .item_list li .con .item .pic img {max-width:100%;}
.item_wrap .item_list li .con .item .name {font-family: 'Roboto'; font-size:12px; color:#fff; line-height:normal;  text-transform:uppercase; padding:2rem 0;   margin-left: -3rem; margin-right: -3rem;}
.item_wrap .item_list li .con .item .name font {font-size:16px; color:#f3e650;}
.item_wrap .item_list li .tit_reward {font-family:'Roboto'; color:#000000; font-weight:700; height:25px; line-height:25px; font-size:12px; color:#000; letter-spacing:0.05rem; text-align:center; background:#fff; width:9rem; text-transform:uppercase; position:absolute; z-index:1; left:0; top:0;}
.item_wrap .item_list li .tit_reward:before {content:''; width:20px; position:absolute; top:0; bottom:0; right:-2rem; background:url('/images/ph/event/2023/military/white_arr.png') 0 0 no-repeat;}
.item_wrap .item_list li .tit_reward_p {background:#ff4642; color:#fff;}
.item_wrap .item_list li .tit_reward_p:before {background:url('/images/ph/event/2023/military/red_arr.png') 0 0 no-repeat;}
.item_wrap .item_list li .con .item_box.prem {background:rgba(45, 0, 0, 0.7); border:1px solid #ff0000;}
.item_wrap .item_list li .con .item_box.prem:after {background:url('/images/ph/event/2023/military/bkr_rt.png') right 0 no-repeat, url('/images/ph/event/2023/military/bkr_lb.png') 0 bottom no-repeat, url('/images/ph/event/2023/military/bkr_rb.png') right bottom no-repeat;}
.item_wrap .item_list li .con .item_box.prem .item .pic {border-color:#ffeb00;}
.item_wrap .item_list li .con .item_box.no_item > div {width:100%; height:100%; background:url('/images/ph/event/2023/military/item/no_item.png') center center no-repeat;}

.section03 {background:url('/images/ph/event/2023/military/bg_section03.jpg') center 0 no-repeat; background-size:cover; position:relative; border-bottom:1px solid #c6a580;}
.section03:before { content:''; display:block; position:absolute; top:0; left:0; bottom:0; right:0; background:url('/images/ph/event/2023/military/ptn_dotted.png') 0 0 repeat;}
.section03 .item {position:relative; }
.section03 .item ul {font-size:0;  position:relative; margin-left:-2rem;}
.section03 .item ul li {display:inline-block; vertical-align:top; max-width:370px; width:25%; margin-bottom:5.8rem; padding-left:2rem;}
.section03 .item ul li .con {position:relative;}
.section03 .item ul li .con .img {position:relative; z-index:1; background:url('/images/ph/event/2023/military/sample02.png') 0 0 no-repeat; background-size:cover;}
.section03 .item ul li .con .img img {max-width:100%;}
.section03 .item ul li .con .name {font-family: 'Roboto'; background:#f9eb4f; font-size:14px; color:#000000; text-transform: capitalize; position:relative; text-align:left; margin-right:2rem; margin-left:2.4rem; padding-left:3rem; padding-top:4.5rem; margin-top:-3.2rem;}
.section03 .item ul li .con .name:before {content:''; display:block; position:absolute; background:url('/images/ph/event/2023/military/bg_name.png') 0 0 no-repeat; height:23px; bottom:-23px; left:0; right:0;}

.section04 {background:url('/images/ph/event/2023/military/bg_section04.jpg') center 0 no-repeat; position:relative;}
.section04 .btns_sns {margin-top:17rem; font-size:0;     margin-bottom: 13.8rem;}
.section04 .btns_sns .sns_li {display:inline-block; vertical-align:top; margin:0 3rem; position:relative;}
.section04 .btns_sns .sns_li .link {position:absolute; bottom:0; top:0; right:0; left:0; font-size:0; color:transparent;}
.section04 .btns_sns .icon {padding-top:18rem; width:250px; height:259px; background-repeat:no-repeat; background-position:0 0; text-align:center; text-transform:uppercase; font-size:14px; font-weight:500;}
.section04 .btns_sns .sns_insta .icon {background-image:url('/images/ph/event/2023/military/sns_insta.png'); color:#dd26d5;}
.section04 .btns_sns .sns_facebook .icon {background-image:url('/images/ph/event/2023/military/sns_facebook.png'); color:#1a4dcf;}
.section04 .btns_sns .sns_discord .icon {background-image:url('/images/ph/event/2023/military/sns_discord.png'); color:#8468ff;}
.section04 .btns_sns .sns_li:hover .icon {background-position:0 -259px; color:#fff;}
.section04 .btns_sns .txt {font-weight: 500; font-size: 14px; width:186px; height:94px; text-align:center; color:#fff; padding-top:4.8rem; margin:0 auto; background-repeat:no-repeat; background-position:0 0;}
.section04 .btns_sns .sns_insta .txt {background-image:url('/images/ph/event/2023/military/sns_tit_insta.png');}
.section04 .btns_sns .sns_facebook .txt {background-image:url('/images/ph/event/2023/military/sns_tit_facebook.png');}
.section04 .btns_sns .sns_discord .txt {background-image:url('/images/ph/event/2023/military/sns_tit_dicord.png');}

footer {width: 100%;  font-family: 'Bai Jamjuree'; position: relative; z-index: 3; position:absolute; bottom:0; left:0; right:0; padding-bottom:10rem; text-transform:uppercase;}
footer > img {margin-bottom: 2.5rem;}
footer .footer {font-size: 12px; color: #fff; position: relative; z-index: 2;}
footer .footer .cs > a {font-family: 'Bai Jamjuree'; color:#eeff6c;}
footer .footer .cs > a:hover {text-decoration: underline;}
footer .footer .copy {margin-top: 8px}


.btn_top {padding-top:4rem; color:#000;  position:fixed; z-index:11; display:block; width:73px; height:75px; font-size:14px; letter-spacing:0.05rem; font-weight:700; text-transform:uppercase; right:3rem; bottom:3rem; background-image:url('/images/ph/event/2023/military/btn_top.png'); background-repeat:no-repeat; background-position:0 0;}
.btn_top:hover {color:#fff; background-position:0 -75px;}

.tit_wrap {padding:15rem 0 7rem ; text-align:center; position:relative; text-shadow: 0 0 5px rgba(0, 0, 0, 0.4); }
.tit_wrap .tit {font-family: 'Alfa Slab One'; font-size:30px; text-transform:uppercase; color:#fff; line-height:1.6; letter-spacing:0.2rem; }
.tit_wrap .txt { font-size:20px; color:#ffffff; line-height:normal; margin-top:5px;}

@media screen and (min-width: 2400px) {
}
	
@media screen and (min-width: 1921px) {
.all_wrap > div {background-size:cover;}
.section01 .cha01 {left:0;}
.section01 .cha02 {right:2%;}
.section02 .conf {top:-57%;}
}

@media screen and (max-width: 1921px) {

}	

@media screen and (max-width: 1800px) {	
.section02 .inner {max-width:none;}	
.item_wrap {padding:0 8rem 0 6rem;}
.item_wrap .swiper-button-next {right:0;}

.section01 .cha {top:15%;}
.section01 .cha01 {width:47.9%;}
.section01 .cha02 {width:25%;}
}	


@media screen and (max-width: 1560px) {	
.section01 .explan > div {width: calc(50% - 8rem);}
.section01 .explan .about {margin-right:8rem;}
.section01 .explan .pass {margin-left:8rem; padding-left:6rem;}
.section01 .explan .con {padding-left:3rem;}
}

	
@media screen and (max-width: 1400px) {	
	
.inner {max-width:100%; padding:0 3rem;}
.section01 .cha {top:20%;} 
.section01 .title_wrap .title .bull {top:48.5%;}
.section02 .inner {padding:0;}
.section02 .tit_wrap {padding-left:3rem; padding-right:3rem;}

}	

@media screen and (max-width: 1280px) {	
header {text-align:center; padding:0;}
header .btn_today {text-align:center; color:#fff; position:relative; width:100%; line-height:normal; height:auto; padding:2rem 0; top:0; right:0; left:0;  background:rgba(106, 35, 24, 0.5);}	
header .btn_today i {position:absolute; top:0; bottom:0; left:0; width:6rem; background:#6a2318; height:auto;}
header .btn_today i:before {content:''; display:block; width:25px; height:26px; background-position:0 -26px; position:absolute; top:50%; left:50%; transform:translate(-50% , -50%);     background-image: url(/images/ph/event/2023/military/icon_close.png); background-repeat:no-repeat; margin-top:2px;}
header .bi {margin-top: 5rem; display:none;}
header .bi.m {display:block;}

.section01 .title_wrap {padding-left:3rem; padding-right:3rem;}
.section01 .title_wrap .title {padding-top:19.5rem; }
.section01 .title_wrap .sub_tit ul li {display:block; margin:2.4rem auto;}
.section01 .explan {border:1px solid #fff; margin:10rem 2.4rem 0; padding:4.8rem;}
.section01 .explan > div {width:100%; display:block;}
.section01 .explan .about {margin:0; padding:0;}
.section01 .explan .pass {margin:0; padding:0; background:none; height:auto; margin-top:6rem;}
.section01 .explan .about .txt {height:auto; background:none; margin-top:0; text-align:left;}
.section01 .explan .pass .con {padding:0; top:auto; transform:none;}
.section01 .explan .con {padding:0; max-width:none;}
.section01 .explan .about .txt .con {top:auto; transform:none;}
.section01 .explan .pass .premium {margin-top:6rem;}
.section01 .explan .about .con {margin-bottom:2rem;}
.section01 .cha01 {display:none;}
.section01 .cha02 {right:auto; left:23%; max-width:600px; width:86%; top:23%;}
.section01 .title_wrap .title {padding-bottom:40%;}
.section01 .circle {transform:translate(-50% , 0) !important; left:50%; top:15rem; width:63%; max-width:651px;}
.section01 .title_wrap .title .bull { top:37%;}
.section01 .title_wrap .title .bull_left {left:0;}
.section01 .title_wrap .title .bull_right {right:0;}

.section02 .conf {max-width:270%; left:-10%; top:-35%;}

.section03 .item ul li {width:calc(100% / 3);}

.item_wrap {padding:0 2.4rem 0 0rem;}
.item_wrap .swiper-container-horizontal>.swiper-scrollbar {display:block;}
.item_wrap .swiper-pagination {display:none;}

}


	
@media screen and (max-width: 1060px) {
.inner {padding-left:3rem; padding-right:3rem;}

.section01 .title_wrap .title {padding-bottom:50%;}

.section03 .item ul li {width:50%;}

.section04 .btns_sns {margin-top:0;     display: inline-block;}
.section04 .btns_sns .sns_li {display:block; margin:0 0 2.4rem;}
.section04 .btns_sns .sns_li:last-child {margin-bottom:0;}
.section04 .btns_sns .txt {width:auto; height:auto; background:none !important; position:absolute; bottom:5.8rem; left:0; right:0;  font-weight:500;}
.section04 .btns_sns .icon {margin:0 auto; padding-top:17rem; background-position:0 0 !important; font-weight:500;}
.section04 .btns_sns .sns_insta .txt {color: #dd26d5;}
.section04 .btns_sns .sns_facebook .txt {color: #1a4dcf;}
.section04 .btns_sns .sns_discord .txt {color: #8468ff;}
.section04 .btns_sns .sns_insta .icon {color:#dd26d5 !important;}
.section04 .btns_sns .sns_facebook .icon {color:#1a4dcf !important;}
.section04 .btns_sns .sns_discord .icon {color:#8468ff !important;}

}




/*** max-width 768 ***/
@media screen and (max-width: 768px) {
.section01 .title_wrap .title .bull { display:none; }

}
/*** max-width 640 ***/
@media screen and (max-width: 640px) {
html {font-size:32%;}
header .bi img {width:140px;}
header .btn_today {font-size:2.3rem; }
header .btn_today i:before {width:19px; height:20px; background-position:0 -20px; background-size:19px auto;}
.mobile {display:block;}

.section01 .title_wrap .sub_tit ul li {font-size:3.7rem; width:240px; height:61px; background-size:240px auto; padding-top:4.4rem;}
.section01 .title_wrap .txt {font-size:3.1rem;}
.section01 .title_wrap .date {font-size:2.7rem;}
.section01 .explan .about .tit {font-size:4.9rem;}
.section01 .explan .about .txt {font-size:2.3rem;}
.section01 .explan .pass .tit {font-size:3.9rem;}
.section01 .explan .pass .txt {font-size:2.3rem;}
.section01 .title_wrap .title {padding-bottom:70%;}
.section01 .circle {width:50%; top:15rem;}
.section01 .cha02 {left:10%; top:18%;}

.section02 .conf {left:-75%;}

.section03 .item ul li .con .name {font-size:2.3rem; padding-bottom:1.5rem; padding-left:2.4rem;}
.section03 .item ul li .con .name:before {height:8px; background-size:auto 8px; bottom:-8px;}
.section03 .item ul li {margin-left:0; margin-right:0;}

.section04 .btns_sns .icon {width:200px; height:207px; background-size:200px auto; font-size:2.3rem; padding-top:26rem;}
.section04 .btns_sns .txt {font-size:2.3rem; bottom:9.4rem;}

.tit_wrap .tit {font-size:3.9rem;}
.tit_wrap .txt {font-size:2.9rem;}

.item_wrap .item_list li .con .level {font-size:2.9rem;}
.item_wrap .item_list li .tit_reward {font-size:2.1rem; height:20px; line-height:20px; width:12rem;}
.item_wrap .item_list li .tit_reward:before {right:-3.8rem; height:20px; background-size:auto 20px;}
.item_wrap .item_list li .con .item .name {font-size:2.1rem; margin-left:-2rem; margin-right:-2rem;}
.item_wrap .item_list li .con .item_box .item {padding-left:2.4rem; padding-right:2.4rem; padding-bottom:4.8rem;}

.item_wrap .swiper-container-horizontal>.swiper-scrollbar {width:85%;  left:50%; transform:translate(-50% , 0);}
.item_wrap .swiper-button-next, .item_wrap .swiper-button-prev {width:35px; height:41px; background-size:35px auto !important;}
.item_wrap .swiper-button-next:hover, .item_wrap .swiper-button-prev:hover  {background-position:0 0;}

footer > img {width:100px; }
footer .footer {position: relative; z-index: 2; font-size:2.1rem;}

.btn_top {width:50px; height:51px; background-size:50px auto; font-size:2.3rem; padding-top:5.2rem;}
.btn_top:hover {background-position:0 0;}

}

@media screen and (max-width: 440px) {
.item_wrap .item_list li .con .item_box.no_item > div {background-size: 70% auto;}
}


@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

	
@keyframes shadowPulse {
  33% {
    border-color: rgba(255, 255, 255, 0.7);
    background:url('/images/ph/event/2023/military/round_dot_g.png') 0 0 no-repeat;
  }
  66% {
    border-color: #ffeb9a;
    background:url('/images/ph/event/2023/military/round_dot_wh.png') 0 0 no-repeat;
  }
  100% {
    border-color: rgba(255, 255, 255, 0.7);
    background:url('/images/ph/event/2023/military/round_dot_g.png') 0 0 no-repeat;
  }
}

@keyframes opaque {
  0% {
    opacity: 0.1;
  }
  40% {
    opacity: 1;
  }
  80% {
    opacity: 0.1;
  }
  100% {
    opacity: 0.1;
  }
}

@keyframes circle1AnimationMove {
	00%, 100% 		{ transform: translate(-50%, -50%) rotate(49deg); }
	07% 					{ transform: translate(-50%, -50%) rotate(38deg); }
	12%, 19%, 68% { transform: translate(-50%, -50%) rotate(42deg); }
	26%, 30% 			{ transform: translate(-50%, -50%) rotate(82deg); }
	73% 					{ transform: translate(-50%, -50%) rotate(34deg); }
	87%, 92% 			{ transform: translate(-50%, -50%) rotate(69deg); opacity:0;}
	94% 					{ transform: translate(-50%, -50%) rotate(65deg); opacity:0;}
}

@keyframes up {
    70% {
        transform: translateY(0%);
    }

    80% {
        transform: translateY(2%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes pulse02{
  0%{
    opacity: 0;
  }
  10%{
    opacity:.50;
    transform-origin: 50% 50%;
    transform: scale(5);
    transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
  }
  100%{
    opacity:1;
    transform: scale(1);
  }
}

@keyframes sword {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-50%, -100%, 0);
    transform: translate3d(-50%, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes cloudLoop {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-50%, 0, 0);
  }
} 
@keyframes kk {
	0% {opacity:0; transform: scale(0.1);} 
	100% {opacity:1; transform: scale(1);}
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes spin {
  0% { transform:translate(-50% ,0) rotate(0deg);}
  70% { transform:translate(-50% ,0) rotate(-315deg);}
  100% { transform:translate(-50% ,0) rotate(-360deg);}
}