@charset "utf-8";

/* --------------------- Unicef Released 2022.07.15 --------------------- */
/* --------------------- Published by 4m Creative --------------------- */


/* ------------------------------------nexon----------------------------------- */

@font-face {
    font-family: 'nexon';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv1 Gothic OTF Light.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'nexon';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv1 Gothic OTF.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'nexon';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv1 Gothic OTF Bold.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

/* ------------------------------------jalnan----------------------------------- */

@font-face {
    font-family: 'jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

/* ------------------------------------noto-sans kr----------------------------------- */

@font-face {
    font-family: 'NS';
    font-weight: 100;
    src: local(※),
    url(../font/NotoSansCJKkr-Light.eot?#iefix) format('embedded-opentype'),
    url(../font/NotoSansCJKkr-Light.ttf) format('truetype');
}
@font-face {
    font-family: 'NS';
    font-weight: 150;
    src: local(※),
    url(../font/NotoSansCJKkr-DemiLight.eot?#iefix) format('embedded-opentype'),
    url(../font/NotoSansCJKkr-DemiLight.ttf) format('truetype');
}
@font-face {
    font-family: 'NS';
    font-style: normal;
    font-display: fallback;
    font-weight: 200;
    src: local(※),
    url(../font/NotoSansCJKkr-Regular.eot?#iefix) format('embedded-opentype'),
    url(../font/NotoSansCJKkr-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'NS';
    font-weight: 300;
    src: local(※),
    url(../font/NotoSansCJKkr-Medium.eot?#iefix) format('embedded-opentype'),
    url(../font/NotoSansCJKkr-Medium.ttf) format('truetype');
}

@font-face {
    font-family: 'NS';
    font-weight: 400;
    src: local(※),
    url(../font/NotoSansCJKkr-Bold.eot?#iefix) format('embedded-opentype'),
    url(../font/NotoSansCJKkr-Bold.ttf) format('truetype');
}
.resizeAlert {    
	width: 100%;
    height: 150px;
    position: fixed;
    z-index: 9999;
    background: rgba(0, 0, 0, .8);
    display: flex;
    align-items: center;
    justify-content: center;
    top: -8rem;
    transition: all ease .3s;
	color: #fff;
	letter-spacing: 0;
}

.emphasis {
	color: #fffc00;
	font-weight: 400;
}

.emphasis-highlight {
	position: relative;
	display: inline-block;
	z-index: 1;
	color: #fff
}

.emphasis-highlight::before {
	content: '';
	display: block;
	width: calc(100% + 8px);
	height: 100%;
	background: #1cabe2;
	position: absolute;
	left: -4px;
	top: -2px;
	z-index: -1
}

.detail-title {
	font-weight: 700;
	margin-bottom: 24px
}

.detail-title span {
	display: inline-block;
	position: relative;
	z-index: 1
}

.txt-gray {
	color: #969797
}

.txt-lgray {
	color: #000;
	opacity: .7
}

address,
article,
aside,
blockquote,
body,
button,
caption,
code,
dd,
div,
dl,
dt,
fieldset,
figcaption,
figure,
form,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
html,
input,
label,
legend,
li,
menu,
nav,
object,
ol,
p,
pre,
section,
table,
tbody,
td,
textarea,
tfoot,
th,
thead,
ul {
	margin: 0;
	padding: 0;
	letter-spacing: -.7px;
	box-sizing: border-box;
}

body,
html {
	width: 100%;
	height: 100%;
	color: #000;
	font-family: 'nexon';
	font-weight: 200;
	font-size: 24px
}

html {
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
	width: 100%;
	background: #fff;
	min-width: 320px;
	-webkit-text-size-adjust: none;
	word-wrap: break-word;
	word-break: break-all
}

button,
input,
select,
textarea {
	border: none;
	font-size: 18px;
	font-family: 'nexon'
}


button {
	cursor: pointer;
	background: 0 0
}

li,
ol,
ul {
	list-style: none
}

table {
	border-spacing: 0;
	border-collapse: collapse;
	table-layout: fixed
}

p {
	line-height: 1.7
}

img {
	max-width: 100%
}

fieldset,
img {
	border: 0
}

address,
cite,
code,
em {
	font-style: normal;
	font-weight: 400
}

button,
img,
input,
label,
select,
textarea {
	vertical-align: middle
}

.hide,
caption,
legend {
	line-height: 0;
	font-size: 1px;
	overflow: hidden
}

hr {
	display: none
}

article,
aside,
figure,
footer,
header,
main,
nav,
section {
	display: block
}

a,
button {
	color: inherit;
	text-decoration: none
}

a:focus,
button:focus {
	outline: 0
}

.for-a11y {
	display: block;
	z-index: -1;
	height: 1px;
	overflow: hidden;
	font-size: 1px;
	line-height: 1px;
	color: transparent;
	border: 0;
	padding: 0;
	opacity: 0;
	filter: alpha(opacity=0);
	background: 0 0;
	position: absolute;
	width: 1px;
	margin: 0
}

caption.for-a11y {
	display: table-caption;
	height: 1px;
	margin-bottom: -1px;
	position: static
}

.clear-fix {
	*zoom: 1
}

.clear-fix::after {
	content: '';
	display: table;
	clear: both
}

textarea {
	outline: 0;
	width: 100%;
	padding: 12px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	resize: none
}

input {
	outline: 0;
	min-width: 68px;
	width: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

input.checkbox {
	position: absolute;
	left: -9999px;
	opacity: 0;
	filter: alpha(opacity=0)
}

input .label-chk::before {
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	border: 1px solid #d9d9d9;
	vertical-align: middle;
	margin-right: 8px
}

input .label-chk.active::before {
	border-color: #d9d9d9
}

input[type=date],
input[type=email],
input[type=file],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url] {
	/* padding: 0 12px; */
	outline: 0
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0
}

input[type=number] {
	-moz-appearance: textfield
}

.ui-input-block {
	width: 320px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.select-box {
	outline: 0;
	min-width: 120px;
	height: 38px;
	border: 1px solid #d9d9d9;
	display: inline-block;
	position: relative;
	text-align: left
}

.select-box select.select {
	position: absolute;
	z-index: 2;
	left: 0;
	width: 100%;
	height: 38px;
	line-height: 41px
}

.select-box span.select {
	position: relative;
	display: block;
	width: 100%;
	padding: 0 30px 0 10px;
	height: 38px;
	line-height: 38px;
	cursor: default;
	z-index: 1;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.js-ui-dropdown-layer,
.js-ui-tab-panel-content {
	display: none
}

.js-ui-tab-panel-content.js-tabpanel-opened {
	display: block
}

.form-flex {
	display: table
}

.form-flex.type-full {
	width: 100%
}

.form-flex-cell {
	display: table-cell;
	vertical-align: middle
}

.form-flex-cell+.form-flex-cell {
	padding-left: 8px
}

.form-flex-cell+.btn-confirm {
	display: table-cell
}

.hide {
	display: none !important
}

.slick-initialized {
	visibility: visible !important
}

.mb_YTPlayer:focus {
	outline: 0
}

.YTPWrapper {
	display: block;
	-webkit-transform: translateZ(0) translate3d(0, 0, 0);
	transform: translateZ(0) translate3d(0, 0, 0);
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.mb_YTPlayer .loading {
	position: absolute;
	top: 10px;
	right: 10px;
	font-size: 12px;
	color: #fff;
	background: rgba(0, 0, 0, .51);
	text-align: center;
	padding: 2px 4px;
	border-radius: 5px;
	font-family: 'Droid Sans', sans-serif;
	-webkit-animation: fade .1s infinite alternate;
	animation: fade .1s infinite alternate
}

.YTPFullscreen,
.inline_YTPlayer img {
	border: none !important;
	padding: 0 !important
}

@-webkit-keyframes fade {
	0% {
		opacity: .5
	}

	100% {
		opacity: 1
	}
}

@keyframes fade {
	0% {
		opacity: .5
	}

	100% {
		opacity: 1
	}
}

.YTPFullscreen {
	display: block !important;
	position: fixed !important;
	width: 100% !important;
	height: 100% !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 !important;
	opacity: 1 !important;
	background-color: #000 !important
}

.inlinePlayButton,
.inlinePlayButtonMobile {
	font-family: ytpregular;
	font-size: 45px;
	color: #fff;
	text-align: center;
	border-radius: 100%;
	background-color: rgba(0, 0, 0, .4);
	position: absolute;
	width: 80px;
	height: 80px;
	line-height: 80px;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	cursor: pointer;
	opacity: .8;
	-webkit-transition: all .4s;
	transition: all .4s;
	-webkit-transform: scale(1.3);
	transform: scale(1.3)
}

.inlinePlayButtonMobile {
	-webkit-transform: scale(1);
	transform: scale(1)
}

.mb_YTPlayer:hover .inlinePlayButton {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1)
}

.inlinePlayButton:hover {
	background-color: #000;
	-webkit-transform: scale(1.3) !important;
	transform: scale(1.3) !important
}

.mbYTP_wrapper iframe {
	max-width: 8000px !important
}

.inline_YTPlayer {
	margin-bottom: 20px;
	vertical-align: top;
	position: relative;
	left: 0;
	overflow: hidden;
	border-radius: 4px;
	-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .7);
	box-shadow: 0 0 5px rgba(0, 0, 0, .7);
	background: rgba(0, 0, 0, .5)
}

.inline_YTPlayer img {
	margin: 0 !important;
	-webkit-transform: none !important;
	transform: none !important
}

.mb_YTPBar,
.mb_YTPBar .buttonBar {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	left: 0;
	padding: 5px;
	width: 100%
}

.mb_YTPBar .ytpicon {
	font-size: 20px;
	font-family: ytpregular
}

.mb_YTPBar .mb_YTPUrl.ytpicon {
	font-size: 30px
}

.mb_YTPBar {
	-webkit-transition: opacity .5s;
	transition: opacity .5s;
	display: block;
	height: 10px;
	background: #333;
	position: fixed;
	bottom: 0;
	text-align: left;
	z-index: 1000;
	font: 14px/16px sans-serif;
	color: #fff;
	opacity: .1
}

.mb_YTPBar.visible,
.mb_YTPBar:hover {
	opacity: 1
}

.mb_YTPBar .buttonBar {
	-webkit-transition: all .5s;
	transition: all .5s;
	background: 0 0;
	font: 12px/14px san-serif;
	position: absolute;
	top: -30px;
	height: 40px
}

.mb_YTPBar:hover .buttonBar {
	background: rgba(0, 0, 0, .4)
}

.mb_YTPBar span {
	display: inline-block;
	font: 16px/20px sans-serif;
	position: relative;
	width: 30px;
	height: 25px;
	vertical-align: middle
}

.mb_YTPBar span.mb_YTPTime {
	width: 130px
}

.mb_YTPBar span.mb_OnlyYT,
.mb_YTPBar span.mb_YTPUrl {
	position: absolute;
	width: auto;
	display: block;
	top: 6px;
	right: 10px;
	cursor: pointer
}

.mb_YTPBar span.mb_YTPUrl img {
	width: 60px
}

.mb_YTPBar span.mb_OnlyYT {
	left: 300px;
	right: auto
}

.mb_YTPBar span.mb_OnlyYT img {
	width: 25px
}

.mb_YTPBar span.mb_YTPUrl a {
	color: #fff
}

.mb_YTPBar .mb_YTPMuteUnmute,
.mb_YTPBar .mb_YTPPlayPause,
.mb_YTPlayer .mb_YTPBar .mb_YTPPlayPause img {
	cursor: pointer
}

.mb_YTPBar .mb_YTPProgress {
	height: 10px;
	width: 100%;
	background: #222;
	bottom: 0;
	left: 0
}

.mb_YTPBar .mb_YTPLoaded {
	height: 10px;
	width: 0;
	background: #444;
	left: 0
}

.mb_YTPBar .mb_YTPseekbar {
	height: 10px;
	width: 0;
	background: #bb110e;
	bottom: 0;
	left: 0;
	-webkit-box-shadow: rgba(82, 82, 82, .47) 1px 1px 3px;
	box-shadow: rgba(82, 82, 82, .47) 1px 1px 3px
}

.mb_YTPBar .YTPOverlay {
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.YTPOverlay.raster {
	background: url(images/raster.png)
}

.YTPOverlay.raster.retina {
	background: url(images/raster@2x.png)
}

.YTPOverlay.raster-dot {
	background: url(images/raster_dot.png)
}

.YTPOverlay.raster-dot.retina {
	background: url(images/raster_dot@2x.png)
}

.mb_YTPBar .simpleSlider {
	position: relative;
	width: 100px;
	height: 10px;
	border: 1px solid #fff;
	overflow: hidden;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin-right: 10px;
	cursor: pointer !important;
	border-radius: 3px
}

.mb_YTPBar.compact .simpleSlider {
	width: 40px
}

.mb_YTPBar.compact span.mb_OnlyYT {
	left: 260px
}

.mb_YTPBar .simpleSlider.muted {
	opacity: .3
}

.mb_YTPBar .level {
	position: absolute;
	left: 0;
	bottom: 0;
	background-color: #fff;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.mb_YTPBar .level.horizontal {
	height: 100%;
	width: 0
}

.mb_YTPBar .level.vertical {
	height: auto;
	width: 100%
}

.br_m, .img_m {display: none;}

#header {
	/* max-width: 1400px; */
	text-align: center;
	display: flex;
	height: 150px;
	position: fixed;
	left: 0;
	top: 0;
	background: 0 0;
	z-index: 50;
	width: 100%;
	left: 0;
	right: 0;
	margin: auto;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

#header .inner {
	display: flex
} 

#header h1 {
	position: relative
}

#header h1 a {
	display: block;
	width: 200px;
	height: 150px;
	background: url(../images/logo@2x.png) no-repeat;
	background-size: contain;
}


#header .btn-mobile-menu {
	display: none;
}



#header .global-menu ul {
	font-size: 0;
	text-align: center;
	padding-left: 8vw;
}

#header .global-menu ul li {
	display: inline-block;
	/* padding: 0 50px; */
	color: #fff
}

#header .global-menu ul li:hover button {
	font-weight: 400
}

#header .global-menu ul li button {
	padding: 60px 40px;
	font-weight: 200;
	font-size: 26px
}

#header .global-menu ul li button.is-active {
	color: #1cabe2;
	font-weight: 400
}

#header.fixed {
	background: #fff;
}

#header.fixed h1 a {
	background: url(../images/logo@2x_w.png) no-repeat;
	background-size: contain;
}

#header.fixed .global-menu ul li {
	color: #000
}

#header.fixed .global-menu ul li button.is-active {
	color: #00adee;
	font-weight: 400
}

html.js-scroll-blocking body {
	overflow: hidden;
	height: 100%
}

#wrap {
	overflow: hidden;
	opacity: 0
}

#wrap .inner {
	width: 1400px;
	margin: 0 auto;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

#wrap.is-active {
	opacity: 1;
	-webkit-transition: opacity 2s;
	transition: opacity 2s
}

.contents-section .title-area {
	text-align: center;
	margin-bottom: 90px
}

.contents-section .title-area .label-title img {
	height: 79px
}

.contents-section .title-area .label-title+h4 {
	margin-top: 40px
}


.contents-section .title-area h4 {
	font-size: 72px
}

.contents-section .detail-title span {
	font-size: 56px
}

.contents-section .detail-title span em {
	color: #ffe400
}

.contents-section .flex+.flex {
	padding: 120px 0
}

.contents-section .flex-contents {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between
}

#cardSection03 .flex .score-background {
	box-shadow: 0px 17px 80px 0px rgba(0, 0, 0, 0.32)
}

#cardSection03 .flex .score-background img {
	width: 100%;
	object-fit: contain
}

#cardSection03 .detail-title {
	margin-bottom: 60px
}

#cardSection03 .score-list {
	margin-top: 125px
}

#cardSection03 .score-list::after {
	content:'';
	display: block;
	width: 100%;
	height: 3px;
	background: url(../images/dotted_line_b.png) repeat-x;
	margin-top: 120px
}

#cardSection03 .score-list ol {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 60px
}

#cardSection03 .score-list ol li > div {
	display: flex;
	align-items: center
}

#cardSection03 .score-list ol .score-num {
	width: 170px;
	height: 170px;
	line-height: 170px;
	text-align: center;
	border-radius: 50%;
	background: #07b5ff;
	flex-shrink: 0;
	color: #fff;
	position: relative;
	margin-right: 25px;
}

#cardSection03 .score-list ol .score-num::before {
	content:'';
	display: block;
	width: 69px;
	height: 55px;
	background: url(../images/awards_check.png) no-repeat;
	background-size: contain;
	position: absolute;
	left: 100px;
	top: -10px
}

#cardSection03 .score-list ol .score-num b {
	font-family: 'jalnan';
	font-size: 82px
}

#cardSection03 .score-list ol .score-num span {
	font-size: 28px
}

#cardSection03 .score-list ol .txt strong {
	font-size: 38px;
}

#cardSection03 .score-list ol .txt p {
	font-size: 24px;
	line-height: 1.5;
	margin-top: 10px
}

.contents-section .detail-list li {
	font-size: 24px
}

.contents-section .detail-list li+li {
	margin-top: 22px
}

#cardSection03 .detail-list li {
	position: relative;
	padding-left: 34px;
}

#cardSection03 .detail-list li::before {
	content:'';
	display: inline-block;
	width: 18px;
	height: 18px;
	background: #000;
	border-radius: 50%;
	position: absolute;
	top: 4px;
	left: 0;
}

#cardSection03 .round-top {
	width: 100%;
	background: #fff;
	border-radius: 20px;
	padding: 40px;
	font-weight: 400;
	margin-bottom: 50px
}

#cardSection03 .round-top span {
	color: #07b5ff
}

#cardSection03 .round-top + span {
	position: relative;
	display: inline-block;
	padding-left: 34px
}

#cardSection03 .round-top + span::before {
	content:'';
	display: inline-block;
	width: 18px;
	height: 18px;
	background: #000;
	border-radius: 50%;
	position: absolute;
	top: 4px;
	left: 0;
}

#cardSection03 .round-table {
	width: 100%;
	margin-top: 35px;
	background: #fff;
	border-radius: 20px;
	border: 4px solid #07b5ff;
	overflow: hidden
}

#cardSection03 .round-table table {
	width: 100%
}

#cardSection03 .round-table table colgroup col:nth-child(3) {
	width: 34%
}

#cardSection03 .round-table table colgroup col:nth-child(4) {
	width: 22%
}

#cardSection03 .round-table table .row > td tr td:nth-child(2) {
	width: 43.6%
}

#cardSection03 .round-table table .row > td tr td:nth-child(3) {
	width: 28.2%
}

#cardSection03 .round-table table thead th:nth-of-type(1) {
	background: #c5ebfb
}

#cardSection03 .round-table table thead th:nth-of-type(2) {
	background: #85ddfc
}

#cardSection03 .round-table table thead th:nth-of-type(3) {
	background: #52cefa
}

#cardSection03 .round-table table thead th {
	font-weight: 400;
	font-size: 34px
}

#cardSection03 .round-table table tbody th {
	font-size: 28px;
}

#cardSection03 .round-table table td {
	font-size: 26px;
	font-weight: 200
}


#cardSection03 .round-table table .row:nth-child(2n) {
	background: #effaff
}

#cardSection03 .round-table table .row > td {
	padding: 0
}

#cardSection03 .round-table table .row > td tr {
	border-bottom: 2px solid #e5eef6
}

#cardSection03 .round-table table .row > td tr:last-child {
	border: none
}

#wrapper_mainVideo {
	margin-top: 94px
}


.button-mute {
	position: absolute !important;
	left: 16px;
	top: 118px;
	z-index: 10;
	text-indent: -9999px;
	overflow: hidden;
	display: block;
	width: 96px;
	height: 96px;
	background: url(../images/ico_mute@2x.png) center center/100% no-repeat
}


.button-mute.is-unmute {
	background-image: url(../images/ico_unmute@2x.png)
}

#cardSection01 {
	position: relative;
	height: 100vh
}


#cardSection01 .bg {
	position: relative;
	height: 100%
}

#cardSection01 .bg img {
	width: 100%;
	height: 100%;
	object-fit: cover
}

#cardSection01 .flex {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	position: absolute;
	left: 0;
	top: -10px;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}


#cardSection01 .btn-join {
	position: fixed;
	right: 10px;
	z-index: 10;
	text-align: right;
	cursor: initial;
}

/* #cardSection01 .btn-join button span {
	position: absolute;
	font-size: 38px;
	line-height: 1.4;
	left: 44%;
	top: 47%;
	z-index: 1;
	transform: translate(-50%, -50%);
	color:#000;
}

#cardSection01 .btn-join button img:last-child {
	position: absolute;
	right: 20%;
	bottom: 25%;
	transform: translateX(50%);
	transition: right ease-in-out .5s;
	z-index: 1;
	opacity: 1;
}

#cardSection01 .btn-join button:after {
	content: '';
	width: 0;
	height: 24px;
	background: url(../images/join_pencil_yellow.png) 0 50%/cover no-repeat;
	display: block;
	position: absolute;
	bottom: 55%;
	left: 26%;
	transition: width ease-in-out .4s
}

#cardSection01 .btn-join button:hover img:last-child {
	animation: pencil .8s alternate;
	right: 20%;
	opacity: 1
}

#cardSection01 .btn-join button:hover:after {
	width:115px
} */

@keyframes pencil {
	0% {
		right:60%;
		bottom:15%; 
	}
	80% {
		right:20%; 
		bottom:15%;
	}
	100% {
		right:20%; 
	}

}


#cardSection01 .title-area {
	position: relative;
	width: 1400px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: flex;
	align-items: flex-end;
	flex-direction: column;
	padding-bottom: 120px;
}


#cardSection01 .title-area h2 {
	color: #fff;
	font-size: 82px;
	font-weight: 500;
	width: 50%
}

#cardSection01 .title-area h2 .pc-block {
	display: block
}

#cardSection01 .title-area h2 span {
	display: inline-block;
	background: #01B9FF;
	font-weight: 400;
	padding: 15px 25px 10px;
	line-height: 1;
}




#cardSection01 .title-area p {
	color: #fcfcfc;
	margin-top: 10px;
	font-size: 32px;
	font-weight: 300;
	width: 50%
}

#cardSection01 .title-area p br {
	display: block
}

#cardSection01 .title-area .share-sns-list {
	position: absolute;
	right: 118px
}

#cardSection01 .title-area .share-sns-list ul {
	font-size: 0
}

#cardSection01 .title-area .share-sns-list ul li {
	display: inline-block;
	background: rgba(255, 255, 255, .4);
	width: 57px;
	height: 57px;
	text-align: center;
	line-height: 62px;
	border-radius: 20px;
}

#cardSection01 .title-area .share-sns-list ul li img {
	margin-left: 3px;
}

#cardSection01 .title-area .share-sns-list ul li+li {
	margin-left: 21px
}



#cardSection01 .arrow {
	position: absolute;
	bottom: 60px;
	animation: main_arrow 3s infinite;
}
@keyframes main_arrow {
	0% {
		bottom: 60px;
	}
	50% {
		bottom: 40px;
	}
	100% {
		bottom: 60px;
	}
}

/* 수상작 갤러리 */
#awardSection { background: url(../images/award_bg.png) no-repeat 0 0; background-size: cover; padding-bottom: 160px; position: relative; }
#awardSection::before { content:''; display: inline-block; width: 373px; height: 462px; background: url(../images/award_balloon.png) no-repeat; background-size: contain; position: absolute; top: 110px; left: 40px; animation: objectPalette 2s ease-in-out infinite; }
#awardSection .title-area { padding: 176px 0 200px; margin-bottom: 0; }
#awardSection .title-area h4 { color: #fff; }
#awardSection .title-area h4:before,#awardSection .title-area h4:after { width: 114px; height: 242px; }
#awardSection .title-area h4:before { background: url(../images/award_tit_deco_l.png) no-repeat 0 0; background-size: contain; top: -60px; left: -110px; z-index: 1; }
#awardSection .title-area h4:after { background: url(../images/award_tit_deco_r.png) no-repeat 0 0; background-size: contain; right: -110px; bottom: initial; top: -60px; }
#awardSection .content-area > div { width: 100%; height: auto; padding: 100px; background: url(../images/award_bg_box.png) no-repeat 0 0; background-size: 100% 100%; position: relative; z-index: 2; }
#awardSection .content-area > div+div { margin-top: 120px; }
#awardSection .content-area .con_tit { font-size: 54px; font-weight: 400; color: #ffcb00; text-align: center; }

#awardSection .content-area .tab_box { margin-bottom: 60px; }
#awardSection .content-area .tab_box ol { display: flex; width: 100%; height: 80px; background: #f0faff; border-radius: 40px; }
#awardSection .content-area .tab_box ol li { cursor: pointer; flex:1; height: 100%; line-height: 80px; text-align: center; font-size: 34px; border-radius: 40px; background: #f0faff; transition: background .3s; }
#awardSection .content-area .tab_box ol li.on { background: #0cb2ff; color: #fff; font-weight: 400; }

#awardSection .content-area .tab_contents { position: relative; }
#awardSection .content-area .tab_contents > div { position: absolute; z-index: -10; opacity: 0; display: none;  }
#awardSection .content-area .tab_contents > div.on { position: relative; z-index: 1; opacity: 1; display: block; }

#awardSection .content-area .award_icon { padding: 40px 0 60px; display: flex; align-items: center; justify-content: space-between; }
#awardSection .content-area .award_icon::before { border-radius: 5px 0 0 5px; }
#awardSection .content-area .award_icon::after { border-radius: 0 5px 5px 0; }
#awardSection .content-area .award_icon::before,
#awardSection .content-area .award_icon::after { display: inline-block; content:''; width: calc(50% - 130px); height: 10px; background: #f1db62; }
#awardSection .content-area .award_icon.silver::before,
#awardSection .content-area .award_icon.silver::after { background: #cad3e7; }
#awardSection .content-area .award_icon.participate::before,
#awardSection .content-area .award_icon.participate::after { background: #cd8571; }
#awardSection .content-area .award_icon.participate { padding-top: 120px; }
#awardSection .content-area ul:not(.swiper-wrapper) { display: flex; flex-wrap: wrap; justify-content: space-between; }
#awardSection .content-area .swiper-container { overflow: hidden; position: relative; }
#awardSection .content-area .swiper-container .swiper-nav { display: flex; align-items: center; width: 180px; margin: 0 auto; padding-bottom: 16px; }
#awardSection .content-area .swiper-container .swiper-pagination { font-size: 24px; color: #999; display: inline-block; position: relative; }
#awardSection .content-area .swiper-container .swiper-pagination-fraction { bottom: 0; }
#awardSection .content-area .swiper-container .swiper-pagination-current { font-size: 28px; color: #0cb2ff; }
#awardSection .content-area .swiper-container .swiper-button { position: relative; cursor: pointer; }
#awardSection .content-area .swiper-container .swiper-button::after { content:''; display: inline-block; width: 17px; height: 17px; border-top: 3px solid #666; border-right: 3px solid #666; }
#awardSection .content-area .swiper-container .swiper-button.prev::after { transform: rotate(225deg); }
#awardSection .content-area .swiper-container .swiper-button.next::after { transform: rotate(45deg); }
#awardSection .content-area .swiper-container .swiper-button.swiper-button-disabled::after { border-color: #f0f0f0; }
#awardSection .content-area ul li { width: calc(50% - 30px); margin-bottom: 100px; }
#awardSection .content-area ul li:nth-last-child(n+1):nth-last-child(-n+2) { margin-bottom: 0; }

#awardSection .content-area ul li .img { width: 100%; }
#awardSection .content-area ul li .img img { width: 100%; object-fit: contain; }
#awardSection .content-area ul li .class { display: inline-block; height: 52px; line-height: 54px; border-radius: 26px; padding: 0 25px; margin: 50px 0 30px; background: #0cb2ff; color: #fff; font-size: 26px; font-weight: 400; }
#awardSection .content-area ul li .pic_tit { color: #0cb2ff; font-size: 32px; font-weight: 400; word-wrap: break-word; word-break: keep-all; /* line-height: 1.3; height: 2.6em; */ }
#awardSection .content-area ul li .name { font-size: 28px; color: #999; margin: 20px 0; }
#awardSection .content-area ul li .pic_des { font-size: 26px; color: #666; word-wrap: break-word; word-break: keep-all; height: 222px; overflow-y: auto; }

#cardSection02 { padding: 250px 0 160px; position:relative; background: linear-gradient(to bottom, #fff 992px, #f1f9ff 100px); }
#cardSection02 .inner { position: relative; }
#cardSection02 .inner::before { content: url(../images/sec2_bg01.png); display: block; position: absolute; top: 210px; transform: translateX(-16px); }
#cardSection02 .title-area { margin-bottom: 155px; }
/* #cardSection02 .title-area h4 { position: relative; font-size: 72px; line-height: 1; color: #000; } */
#cardSection02 .subject-content { position: relative; text-align: center; padding: 75px 0; }
#cardSection02 .subject-content:before { content: url(../images/sec2_bg01_sticky_left.png); display: inline-block; position: absolute; left: -57px; top: -55px; }
#cardSection02 .subject-content:after { content: url(../images/sec2_bg01_sticky_right.png); display: inline-block; position: absolute; right: -52px; top: -65px; }
#cardSection02 .subject-content > p { font-size: 34px; color: #07b5ff; line-height: 1; border: 4px solid #00b9ff; display: table; margin: auto; padding: 11px 36px 10px; border-radius: 31.5px; }
#cardSection02 .subject-content > p b:before { content: ''; display: inline-block; width: 2px; height: 29px; background: #07b5ff; vertical-align: top; margin: 0 30px;  }
#cardSection02 .subject-content .btn-group { margin: 72px 0 49px }
#cardSection02 .subject-content .txt-emphasis { margin-top: 50px; font-size: 80px; color: #000; line-height: 1.3; position: relative; display: inline-block }
#cardSection02 .subject-content .txt-emphasis:before { content: url(../images/sec2_title_pencil2.png); display: block; position: absolute; bottom: 87px; left: -90px; }
#cardSection02 .subject-content .txt-emphasis b { position: relative; }
#cardSection02 .subject-content .txt-emphasis b:before { content: url(../images/sec2_title_pencil.png); display: block; position: absolute; left: -88px; bottom: -25px; }
#cardSection02 .subject-content .txt-emphasis b:after { content: url(../images/sec2_title_underline.png); display: block; position: absolute; bottom: -40px; }
#cardSection02 .subject-content .txt-empsub { color: #000; font-family: 'NS'; font-size: 24px; letter-spacing: -.06rem; line-height: 1.42; margin-top: 30px; }
#cardSection02 .subject-content .txt-empsub b { color: #000; }
#cardSection02 .subject-content .txt-empsub p { line-height: 1.7; font-size: 20px; color: #999999; }
#cardSection02 .subject-content .button { width: calc(100% - 144px); margin:55px auto 0; background: #f1f9ff; border-radius: 30px; padding: 45px 0 50px; text-align: center; }
#cardSection02 .subject-content .button p { font-size: 28px; line-height: 1.6; color: #666666; letter-spacing: -.08rem; padding-bottom: 45px; }
#cardSection02 .subject-content .button p span { color: #00b9ff; }
#cardSection02 .subject-content .button a { transition: all ease .3s; position: relative; font-size: 26px; color: #fff; font-weight: 400; background: #00b9ff; padding: 23px 0; margin: auto; text-align: center; width: 460px; display: block; border-radius: 22px; }
/* #cardSection02 .subject-content .button a:after { content: ''; width: 28px; height: 28px; background: #fff url(../images/sec2_button_arrow.png) 50% 50% no-repeat; display: inline-block; border-radius: 100%; margin-left: 20px; vertical-align: text-top; transition: all ease .3s; } */
#cardSection02 .subject-content .button a span { font-size: 18px; vertical-align: middle; font-weight: 200; }
#cardSection02 .subject-content .button a:hover { transform: scale(.95); }

#cardSection02 .swiper_wrap { position: relative; margin-top: 80px; }
#cardSection02 .swiper_wrap h2 { max-width: 1400px; margin: auto; line-height: 1.5; font-size: 30px; font-weight: 200; text-align: center; letter-spacing: -.08rem; }
#cardSection02 .swiper_wrap h2 b { font-weight: 400; color: #00b9ff; }
#cardSection02 .swiper_wrap .swiper { margin:57px auto 0; max-width: 1400px; }
#cardSection02 .swiper_wrap .swiper-buttons { width: 57px; height:57px; border-radius: 100%; border: 2px solid #000; top:60%; right: 0; left: 0; margin: auto; }
#cardSection02 .swiper_wrap .swiper-buttons:after { background-repeat: no-repeat; background-position: center center; height: 90%; }
#cardSection02 .swiper_wrap .swiper-button-next { transform: translateX(779px); }
#cardSection02 .swiper_wrap .swiper-button-next:after { content: url(../images/swiper-button-next.png); }
#cardSection02 .swiper_wrap .swiper-button-prev { transform: translateX(-779px); }
#cardSection02 .swiper_wrap .swiper-button-prev:after { content: url(../images/swiper-button-prev.png); }
#cardSection02 .swiper_wrap .swiper-button-next.swiper-button-disabled, 
#cardSection02 .swiper_wrap .swiper-button-prev.swiper-button-disabled { opacity: .2; }
#cardSection02 .swiper_wrap .swiper-pagination { display: none; }

#cardSection02_2 { padding-top: 187px; position:relative; background: linear-gradient(to bottom, #fff 950px, #07b5ff 100px); }
#cardSection02_2 .inner { position: relative; }
#cardSection02_2::after { content: ''; display: block; width: 307px; height: 417px; background: url(../images/sec2_cube_bg.png) no-repeat center center; background-size: 100%; position: absolute; left: 0; top: -85px; -webkit-animation: objectPalette 2s linear infinite; animation: objectPalette 2s linear infinite; }
#cardSection02_2::before { content: ''; display: block; width: 100%; height: 60vw; background: url(../images/sec2_wave_bg.png) center top no-repeat; position: absolute; left:0; top: 711px; }
/* #cardSection02_2 .title-area h4 { position: relative; font-size: 72px; line-height: 1; color: #000; } */
#cardSection02_2 .about-content .about-cover { position: relative; }
#cardSection02_2 .about-content .about-cover img { width:100%; height: 100%; object-fit: cover; box-shadow: 0px 17px 80px 0px rgba(0, 44, 81, 0.32); border-radius: 10px; }
#cardSection02_2 .about-content .campaign-detail { margin-top: 120px }
#cardSection02_2 .about-content .campaign-detail .flex { padding: 0 0 120px; display: flex; }
#cardSection02_2 .about-content .campaign-detail .flex > div { width: 50%; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-title { font-size: 56px; font-weight: 400; color: #000; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-title span { color: #ffe400; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-title em { display: inline-block; font-size: 24px; font-weight: 400; color: #ffe400; }
#cardSection02_2 .about-content .campaign-detail > div:nth-child(1) > div:first-child .detail-list li { display: flex; align-items: center; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list .ico-yellow, 
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list .ico-normal { display: inline-block; padding: 0 14px; height: 32px; line-height: 32px; color: #00aeef; font-weight: 400; font-size: 22px; background: #fffc00; border-radius: 16px; text-align: center; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list .ico-yellow +p .emphasis,
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list .ico-normal +p { color: #fffc00; font-size: 24px; font-weight: 400; line-height: 32px; padding-left: 20px; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list .ico-normal { background: #fff; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list .ico-normal +p { color: #fff; font-weight: 200; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list.second li { display: flex; flex-direction: column; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list.second li p { padding-left: 0; color:#fff; font-weight: 200; font-size: 24px; line-height: 40px; }
#cardSection02_2 .about-content .campaign-detail .flex > div .detail-list.second li .attention { display: block; font-size: 18px; line-height: 1.7; color: #0d4e67; margin-top: 22px; font-family: 'NS'; }
#cardSection02_2 .about-content .campaign-detail .flex+.flex { background: url(../images/sec2_dotted_line.png) top center no-repeat; border-top: none; padding-top: 120px; }
#cardSection02_2 .about-content .campaign-detail .flex+.flex > div { width: 100%; }
#cardSection02_2 .about-content .campaign-detail .flex+.flex > div .irrelevant { font-size: 20px; font-weight: 400; color: #ffe400; text-decoration: underline; text-underline-position : under; display: block; }
#cardSection02_2 .about-content .campaign-detail .detail-list.type-dots li { position: relative; padding-left: 62px; font-size: 24px; font-weight: 200; color: #fff; line-height: 2.3; margin-top: 0; }
#cardSection02_2 .about-content .campaign-detail .detail-list.type-dots li span { background: #fff; color: #00b9ff; text-align: center; line-height: 45px; font-size: 22px; font-weight: 400; border-radius: 100%; width: 42px; height: 42px; display: inline-block; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; }
#cardSection02_2 .about-content .campaign-detail .detail-list.type-dots li p { font-family: 'NS'; font-size: 18px; padding-left: 0; line-height: 1; margin-top: 15px; }
#cardSection02_2 .about-content .campaign-detail .detail-list.type-dots li:first-child { line-height: 1; margin-bottom: 20px; }
#cardSection02_2 .about-content .join-process { margin-top: 60px; }
#cardSection02_2 .about-content .join-process > ul::after {content: ''; display: table; clear: both; }
#cardSection02_2 .about-content .join-process > ul > li {float: left; position: relative; width: 320px; height: 611px; }
#cardSection02_2 .about-content .join-process > ul > li .box { border: 4px solid #fff; border-radius: 10px; padding: 30px 10px; text-align: center; height: 100%; -webkit-box-shadow: 3px 4px 34px 0px rgba(0, 44, 81, 0.08); box-shadow: 3px 4px 34px 0px rgba(0, 44, 81, 0.08); }
#cardSection02_2 .about-content .join-process > ul > li+li { margin-left: 40px }
#cardSection02_2 .about-content .join-process > ul > li::after { content: ''; display: block; width: 22px; height: 43px; position: absolute; z-index: 9;}
#cardSection02_2 .about-content .join-process > ul > li:nth-child(1) .box { background: #8fe0ff; }
#cardSection02_2 .about-content .join-process > ul > li:nth-child(1)::after { background: url(../images/ico_arr_step1_arrow.png) center center/100% no-repeat; width: 112px; height: 108px; right: -30px; top: 96px; }
#cardSection02_2 .about-content .join-process > ul > li:nth-child(2) .box { background: #aee9ff; }
#cardSection02_2 .about-content .join-process > ul > li:nth-child(2)::after { background: url(../images/ico_arr_step2_arrow.png) center center/100% no-repeat; width: 127px; height: 46px; right: -90px; top: 325px; }
#cardSection02_2 .about-content .join-process > ul > li:nth-child(3) .box { background: #d8f7ff; }
#cardSection02_2 .about-content .join-process > ul > li:nth-child(3)::after { background: url(../images/ico_arr_step3_arrow.png) center center/100% no-repeat; width: 113px; height: 57px; right: -86px; top: 93px;  }
#cardSection02_2 .about-content .join-process > ul > li:nth-child(4) .box { background: #fff; }
#cardSection02_2 .about-content .join-process ul li .txt-step { margin:26px 0 35px; line-height: 1; font-family: 'jalnan'; font-size: 30px; color: #000; }
#cardSection02_2 .about-content .join-process ul li .ico-process { margin: 0 auto 45px; }
#cardSection02_2 .about-content .join-process ul li .txt-desc { font-size: 24px; color: #000; line-height: 1.5; letter-spacing: -.04rem; word-break: keep-all; }
#cardSection02_2 .about-content .join-process ul li .txt-desc p { font-size: 18px; padding-top: 5px; line-height: 1.4; }
#cardSection02_2 .about-content .join-process ul li .btn-group { position: absolute; width: 100%; bottom: 30px; left:0; }
#cardSection02_2 .about-content .join-process ul li .btn-group .btn-primary,
#cardSection02_2 .about-content .join-process ul li .btn-group .btn-primary2 { transition: all ease .3s; font-size: 24px; color: #fff; background: #00b9ff; height: 58px; border-radius: 20px; font-weight: 400; text-align: center; width: calc(100% - 52px); }
/* #cardSection02_2 .about-content .join-process ul li .btn-group .btn-primary:hover, */
/* #cardSection02_2 .about-content .join-process ul li .btn-group .btn-primary2:hover { transform: scale(.95); } */
#cardSection02_2 .about-content .gift-list { padding: 30px 0 106px; font-size: 32px; color: #000; font-weight: 400; display: flex; justify-content: space-between; position: relative; }
#cardSection02_2 .about-content .gift-list:after { content: ''; width: 68px; height: 68px; background: url(../images/gift_plus.png) center center no-repeat; background-size: contain; display: block; position: absolute; margin: auto; right: 0; left: 0; top: 0; bottom: 0; transform: translateY(25px); }
#cardSection02_2 .about-content .gift-list .gift-item { position: relative; width: calc(50% - 60px); text-align: center; }
#cardSection02_2 .about-content .gift-list .gift-item:before { content: ''; width: 100%; height: 445px; background: #2cc5ff; display: block; position: absolute; border-radius: 5px; top: 65px; box-shadow: 0px 5px 34px 0px rgba(0, 44, 81, 0.08); }
#cardSection02_2 .about-content .gift-list .img { margin-bottom: 15px; position: relative; }
#cardSection02_2 .about-content .gift-list p { position: absolute; line-height: 1; margin: auto; right: 0; left: 0; bottom: 0; }
#cardSection02_2 .about-content .gift-list span:after {  content: ''; display: block; position: absolute; background-position: center center; background-repeat: no-repeat; } 
#cardSection02_2 .about-content .gift-list .item-1-1 { right: 25px; position: relative; display: block; }
#cardSection02_2 .about-content .gift-list .item-1-1:after { background: url(../images/gift_postcard_heart.png) no-repeat; background-size: contain; width: 74px; height: 72px; top: 175px; right: -30px; }
#cardSection02_2 .about-content .gift-list .item-2-1 { top: -25px; position: relative; display: block; }
#cardSection02_2 .about-content .gift-list .item-2-1:before { content:''; display: block; background: url(../images/gift_wappen_shine01.png) no-repeat; background-size: contain; width: 42px; height: 57px; position: absolute; left: 51px; top: 298px; z-index: 1; }
#cardSection02_2 .about-content .gift-list .item-2-1:after { content:''; display: block; background: url(../images/gift_wappen_shine02.png) no-repeat; background-size: contain; width: 45px; height: 51px; position: absolute; right: 128px; top: 62px; z-index: 1; }
#cardSection02_2 .about-content .gift-list .gift-item:hover .img span img { animation: giftHover 1s infinite; }
#cardSection02_2 .about-content .gift-list .gift-item:hover .img .item-1-1:after,
#cardSection02_2 .about-content .gift-list .gift-item:hover .img .item-2-1:after,
#cardSection02_2 .about-content .gift-list .gift-item:hover .img .item-2-1:before { animation: giftHover2 1s infinite; }
#cardSection02_2 .about-content .campaign-detail .detail-list.type-dots:last-child li { padding-left: 0; }
#cardSection02_2 .about-content .campaign-detail .detail-list.type-dots:last-child li:before { content: ''; width: 18px; height: 18px; background: #fff; border-radius: 100%; display: inline-block; margin-right: 14px; }
#cardSection02_2 .about-content .campaign-detail .flex:last-of-type { padding: 120px 0 150px; }

@keyframes giftHover {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	
	50% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg)
	}

	100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
}

@keyframes giftHover2 {
	0% {
		opacity:1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	
	50% {
		opacity:0;
		-webkit-transform: scale(.9);
		transform: scale(.9);
	}

	100% {
		opacity:1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

#cardSection03 {
	padding-top: 180px;
	background: #f3f8fe;
	position: relative
}

#cardSection03::before {
	content:'';
	display: block;
	width: 160px;
	height: 116px;
	background: url(../images/awards_object01.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: 137px;
	left: 86px;
	animation: objectRotate 1.5s linear infinite
}

#cardSection03::after {
	content:'';
	display: block;
	width: 520px;
	height: 586px;
	background: url(../images/awards_object02.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: -519px;
	right: -154px;
	animation: objectBrush 1.5s linear infinite
}

#cardSection03 .inner::before {
	content:'';
	display: block;
	width: 339px;
	height: 339px;
	background: url(../images/awards_object03.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: -177px;
	right: -233px
}

#cardSection03 .flex+.flex {
	padding-bottom: 0
}

#cardSection03 .score-info {
	width: calc(100% + 48px);
	margin: 56px 0 0 -24px
}

#cardSection03 .score-info .score-background {
	position: relative;
	width: 612px
}

#cardSection03 .score-info .score-background::before {
	content: '';
	display: block;
	width: 84px;
	height: 84px;
	background: url(../images/obj_orange_crayon@2x.png) center center/100% no-repeat;
	position: absolute;
	left: 0px;
	bottom: 40px
}

#cardSection03 .score-info .score-list {
	width: 594px
}

#cardSection03 .score-info .score-list li {
	padding: 22px 27px 21px 88px;
	border-radius: 10px;
	-webkit-box-shadow: 0 2px 12px 0 rgba(238, 238, 238, .5);
	box-shadow: 0 2px 12px 0 rgba(238, 238, 238, .5);
	border: 2px solid #b2def1;
	background-color: #fff;
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center
}

#cardSection03 .score-info .score-list li+li {
	margin-top: 32px
}

#cardSection03 .score-info .score-list li strong {
	display: block;
	font-size: 22px
}

#cardSection03 .score-info .score-list li p {
	font-size: 16px;
	margin-top: 4px
}

#cardSection03 .score-info .score-list li .score-num {
	position: absolute;
	right: 26px;
	top: 33px;
	color: #1cabe2;
	font-weight: 700;
	padding-left: 32px
}

#cardSection03 .score-info .score-list li .score-num::before {
	content: '';
	display: block;
	width: 23px;
	height: 22px;
	background: url(../images/ico_score_check@2x.png) center center/100% no-repeat;
	position: absolute;
	left: 0;
	top: 0
}

#cardSection03 .txt-lgray {
	font-size: 18px;
	margin-top: 35px
}

#cardSection04 {
	background: #f3f8fe url(../images/faq_bg.png) no-repeat 50% 0;
	background-size: cover;
	padding: 238px 0 200px;
	position: relative;
	background-size: cover
}

#cardSection04 .inner {
	position: relative;
	z-index: 1
}

#cardSection04::before {
	content: '';
	display: block;
	width: 84px;
	height: 84px;
	background: url(../images/faq_object01.png) center center/100% no-repeat;
	position: absolute;
	left: 114px;
	top: 50px;
}

#cardSection04::after {
	content: '';
	display: block;
	width: 601px;
	height: 413px;
	background: url(../images/faq_object02.png) center center/100% no-repeat;
	position: absolute;
	right: -60px;
	top: 200px;
	z-index: 0;
}

#cardSection04 .title-area {
	margin-bottom: 100px

}

.title-area h4 {
	position: relative;
	display: inline-block
}

.title-area h4:before, .title-area h4:after {
	content:'';
	display: inline-block;
	width: 50px;
	height: 50px;
	position: absolute
}

.title-area h4:before {
	background: url(../images/bracket_l.png);
	top: -27px;
	left: -36px;
}

.title-area h4:after {
	background: url(../images/bracket_r.png);
	bottom: -28px;
	right: -28px;
}




.btn-group {
	font-size: 0
}

.btn {
	display: inline-block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.btn-primary-arrow {
	background: #1cabe2;
	font-size: 24px;
	text-align: left;
	padding: 16px 90px 16px 46px;
	color: #fff;
	border-radius: 32px;
	position: relative
}


.btn-primary-arrow::before {
	content: '';
	display: block;
	width: 30px;
	height: 16px;
	background: url(../images/ico_arr_accordion@2x.png) center center/100% no-repeat;
	position: absolute;
	right: 34px;
	top: 23px;
	-webkit-transition: .3s;
	transition: .3s
}


.btn-primary-arrow.is-active::before {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg)
}

.btn-download-white {
	background: #fff;
	text-align: left;
	font-weight: 700;
	font-size: 20px;
	border: 1px solid #979797;
	border-radius: 8px;
	padding: 20px 28px 20px 60px;
	position: relative
}

.btn-download-white::before {
	content: '';
	display: block;
	width: 22px;
	height: 23px;
	background: url(../images/ico_download@2x.png) center center/100% no-repeat;
	position: absolute;
	left: 26px;
	top: 20px
}

.form-item+.form-item {
	margin-top: 64px
}

.form-label {
	font-weight: 700;
	font-size: 20px;
	position: relative
}

.form-label .ui-checkbox-text,
.form-label .ui-radio-text {
	font-size: 20px
}

.form-label+.form-group {
	margin-top: 32px
}

.form-label .accordion-opener {
	background: #2589c9;
	color: #fff;
	font-size: 16px;
	height: 38px;
	padding: 0 40px 0 16px;
	line-height: normal;
	min-width: 106px;
	position: absolute;
	right: 0;
	top: -5px
}

.form-label .accordion-opener::before {
	content: '';
	display: block;
	width: 18px;
	height: 18px;
	background: url(../images/ico_accordion_arrow@2x.png) center center/100% no-repeat;
	position: absolute;
	right: 16px;
	top: 50%;
	margin-top: -8px;
	-webkit-transform: rotate(-180deg);
	transform: rotate(-180deg);
	-webkit-transition: -webkit-transform .3s;
	transition: -webkit-transform .3s;
	transition: transform .3s;
	transition: transform .3s, -webkit-transform .3s
}


.js-accordion-opened .form-label .accordion-opener::before {
	-webkit-transform: rotate(0);
	transform: rotate(0)
}

.form-tip {
	font-size: 16px;
	margin-top: 32px
}

.form-tip.type-icon {
	text-align: center
}

.form-tip.type-icon img {
	vertical-align: middle;
	margin-top: -4px;
	margin-right: 8px;
	display: inline-block
}


.form-table {
	background: #f8f9fa;
	padding: 32px;
	margin-top: 32px
}


.ui-input-block+.ui-input-block {
	margin-top: 8px
}

.ui-input-block.type-zipcode {
	width: 100%;
	padding-right: 192px;
	position: relative
}

.ui-input-block.type-zipcode .btn-zipcode {
	position: absolute;
	right: 0;
	top: 0
}

.ui-input-block.type-full {
	width: 100%
}

.ui-input {
	width: 100%;
	border: 1px solid #e5e6e8;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	height: 56px;
	padding: 0 16px;
	font-size: 16px
}

.ui-input:-moz-read-only {
	background: #f8f9fa;
	color: #8d8d8d
}

.ui-input:read-only {
	background: #f8f9fa;
	color: #8d8d8d
}


.ui-checkbox-block,
.ui-radio-block {
	position: relative;
	z-index: 0;
	display: inline-block;
	margin-right: 40px;
	vertical-align: top
}

.ui-checkbox-block.is-disable .ui-radio-label.checked .ui-radio-object,
.ui-radio-block.is-disable .ui-radio-label.checked .ui-radio-object {
	background-position: 0 -40px
}

.ui-checkbox-block.is-disable .ui-radio-object,
.ui-radio-block.is-disable .ui-radio-object {
	background-position: 0 -60px
}

.ui-checkbox-block.is-disable .ui-checkbox-label.checked .ui-checkbox-object,
.ui-radio-block.is-disable .ui-checkbox-label.checked .ui-checkbox-object {
	background-position: 0 -40px
}

.ui-checkbox-block.is-disable .ui-checkbox-object,
.ui-radio-block.is-disable .ui-checkbox-object {
	background-position: 0 -60px
}

.ui-checkbox,
.ui-radio {
	display: block;
	z-index: -1;
	height: 1px;
	overflow: hidden;
	color: transparent;
	border: 0;
	padding: 0;
	opacity: 0;
	background: 0 0;
	position: absolute;
	width: 1px;
	margin: 0;
	cursor: pointer
}

.ui-checkbox:disabled+.ui-checkbox-label,
.ui-radio:disabled+.ui-checkbox-label {
	cursor: default
}

.ui-checkbox:disabled+.ui-checkbox-label .ui-checkbox-text,
.ui-radio:disabled+.ui-checkbox-label .ui-checkbox-text {
	color: #d9d9d9
}

.ui-checkbox:disabled+.ui-radio-label,
.ui-radio:disabled+.ui-radio-label {
	cursor: default
}

.ui-checkbox:disabled+.ui-radio-label .ui-radio-text,
.ui-radio:disabled+.ui-radio-label .ui-radio-text {
	color: #d9d9d9
}

.ui-checkbox-label,
.ui-radio-label {
	cursor: pointer;
	display: block;
	font-size: 0;
	line-height: 0
}

.ui-checkbox-text,
.ui-radio-text {
	display: inline-block;
	vertical-align: middle;
	font-size: 16px;
	line-height: 24px
}


.ui-checkbox-object+.ui-checkbox-text,
.ui-checkbox-text+.ui-checkbox-object,
.ui-radio-object+.ui-radio-text,
.ui-radio-text+.ui-radio-object {
	margin-left: 8px
}

.ui-radio-object {
	display: inline-block;
	vertical-align: middle;
	width: 24px;
	height: 24px;
	background: #fff;
	border-radius: 100%;
	border: 1px solid #e5e6e8;
	position: relative
}

.ui-radio-object::before {
	content: '';
	display: block;
	width: 14px;
	height: 14px;
	position: absolute;
	left: 5px;
	top: 5px;
	background: #fff;
	border-radius: 100%;
	-webkit-transform: scale(0);
	transform: scale(0);
	opacity: 0;
	-webkit-transition: .2s;
	transition: .2s
}

.ui-radio-label.checked .ui-radio-object::before {
	background: #1cabe2;
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity: 1
}

.ui-checkbox-object {
	display: inline-block;
	vertical-align: text-bottom;
	width: 24px;
	height: 24px;
	border: 1px solid #d9d9d9
}

.ui-checkbox-label.checked .ui-checkbox-object {
	background: url(../images/ico_check@2x.png) center center/22px no-repeat;
	border-color: #1cabe2
}

.ui-checkbox-block .ui-checkbox-object {
	position: absolute;
	top: 0
}

.ui-checkbox-block .ui-checkbox-text {
	margin-left: 32px
}

table {
	width: 100%
}

table td,
table th {
	text-align: center;
	padding: 16px 0;
	font-size: 16px;
	line-height: 1.7
}

table td.a-left,
table th.a-left {
	text-align: left
}

table tr:first-child td,
table tr:first-child th {
	border: none
}

table th {
	font-weight: 700
}

table td {
	font-weight: 400
}

.faq-accordion .ui-accordion-item {
	border-bottom: 2px solid #fff;
	margin-bottom: 10px 
}

.faq-accordion .ui-accordion-header {
	position: relative;
	padding: 24px 0 24px 114px
}

.faq-accordion .ui-accordion-header::before {
	content:'';
	display: inline-block;
	width: 50px;
	height: 50px;
	background: #07b5ff;
	border-radius: 50%;
	text-align: center;
	line-height: 50px;
	font-size: 28px;
	font-weight: 400;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 7px;
	transform: translateY(-50%)
}

.faq-accordion .js-ui-accordion-list >div:nth-of-type(1) .ui-accordion-header::before {content:'1';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(2) .ui-accordion-header::before {content:'2';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(3) .ui-accordion-header::before {content:'3';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(4) .ui-accordion-header::before {content:'4';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(5) .ui-accordion-header::before {content:'5';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(6) .ui-accordion-header::before {content:'6';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(7) .ui-accordion-header::before {content:'7';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(8) .ui-accordion-header::before {content:'8';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(9) .ui-accordion-header::before {content:'9';}
.faq-accordion .js-ui-accordion-list >div:nth-of-type(10 ) .ui-accordion-header::before {content:'10';}

.faq-accordion .ui-accordion-subject {
	font-weight: 400;
	position: relative;
	padding: 0 48px;
	line-height: 40px;
	display: block;
	font-size: 32px;
}

.faq-accordion .ui-accordion-subject::before {
	content: 'Q.';
	display: block;
	font-family: 'jalnan';
	font-size: 34px;
	line-height: 1;
	position: absolute;
	left: 0;
	top: 0
}

.faq-accordion .ui-accordion-opener {
	text-indent: -9999px;
	overflow: hidden;
	display: block;
	font-size: 0;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%
}

.faq-accordion .is-active .ui-accordion-opener::before {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg)
}

.faq-accordion .ui-accordion-body {
	display: none
}

.faq-accordion .ui-accordion-contents {
	position: relative;
	padding: 33px 50px 33px 157px;
	font-size: 26px;
	line-height: 1.6;
	background: #fff;
}


.faq-accordion .ui-accordion-contents::before {
	content: 'A.';
	display: inline-block;
	font-family: 'jalnan';
	font-size: 34px;
	color: #00b9ff;
	position: absolute;
	left: 112px;
	top: 20px
}

.slick-slider {
	position: relative;
	display: block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
	-khtml-user-select: none;
	-ms-touch-action: pan-y;
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent
}

.slick-list {
	position: relative;
	display: block;
	overflow: hidden;
	margin: 0;
	padding: 0
}

.slick-list:focus {
	outline: 0
}

.slick-list.dragging {
	cursor: pointer
}

.slick-slider .slick-list,
.slick-slider .slick-track {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
}

.slick-track {
	position: relative;
	top: 0;
	left: 0;
	display: block;
	margin-left: auto;
	margin-right: auto
}

.slick-track:after,
.slick-track:before {
	display: table;
	content: ''
}

.slick-track:after {
	clear: both
}

.slick-loading .slick-track {
	visibility: hidden
}

.slick-slide {
	display: none;
	float: left;
	height: 100%;
	min-height: 1px
}

[dir=rtl] .slick-slide {
	float: right
}

.slick-slide img {
	display: block
}

.slick-slide.slick-loading img {
	display: none
}

.slick-slide.dragging img {
	pointer-events: none
}

.slick-initialized .slick-slide {
	display: block
}

.slick-loading .slick-slide {
	visibility: hidden
}

.slick-vertical .slick-slide {
	display: block;
	height: auto;
	border: 1px solid transparent
}

.slick-arrow.slick-hidden {
	display: none
}


#modal {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .7);
	z-index: 51;
	overflow-y: scroll;
	display: none
}

#modal iframe {
	width: 880px;
	height: calc(100% - 120px);
	position: absolute;
	margin:120px auto;
	background: #fff;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 20px 20px 0 0;
	left: 50%;
	transform: translateX(-50%);
	border: none;
}
#modal .layer {
	position: relative;
	margin:120px auto 60px;
	background: #fff;
	padding: 60px 50px 140px 50px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 20px;
}

#modal .modal-close {
	width: 36px;
	background: 0 0;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: 40px;
}

#modal .modal-header {
	/* position: relative; */
	padding-bottom: 54px
}

#modal .modal-header h2 {
	font-size: 40px;
	text-align: center
}
/*  */



#modal #modalGuide {
	width: 880px
}

@media only screen and (max-width:800px) {
	#modal #modalGuide {
		border-radius: 10px;
		margin: 80px auto 20px;
	}
}

#modal #modalGuide .modal-body {
	padding: 60px 0 36px
}

#modal #modalGuide .warning-message-text {
	text-align: left;
	font-size: 18px;
	margin-top: 24px
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .warning-message-text {
		font-size: 14px
	}
}

#modal #modalGuide .accept-title {
	text-align: center;
	margin: 0 0 32px
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-title {
		padding: 0 24px
	}
}

#modal #modalGuide .accept-title span {
	display: inline-block;
	position: relative
}

#modal #modalGuide .accept-title span::after,
#modal #modalGuide .accept-title span::before {
	content: '';
	display: block;
	width: 33px;
	height: 24px;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	top: -24px
}

#modal #modalGuide .accept-title span::before {
	background-image: url(../images/ico_quotes_left@2x.png);
	left: -50px
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-title span::before {
		left: -10px;
		width: 24px;
		height: 20px
	}
}

#modal #modalGuide .accept-title span::after {
	background-image: url(../images/ico_quotes_right@2x.png);
	right: -50px
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-title span::after {
		right: -10px;
		width: 24px;
		height: 20px
	}
}

@media only screen and (max-width:1280px) {
	#modal #modalGuide .accept-title {
		font-size: 24px
	}
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-title {
		font-size: 18px
	}
}

#modal #modalGuide .accept-example-item {
	border-radius: 30px;
	padding: 32px;
	background: #fff;
	text-align: center
}

#modal #modalGuide .accept-example-item .type-title {
	font-weight: 700;
	font-size: 20px
}

#modal #modalGuide .accept-example-item .type-title .ico {
	display: block;
	width: 48px;
	height: 48px;
	background-size: 48px;
	margin: 0 auto 10px;
	background-repeat: no-repeat;
	background-position: center center
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-example-item .type-title {
		font-size: 16px
	}

	#modal #modalGuide .accept-example-item .type-title .ico {
		width: 32px;
		height: 32px;
		background-size: 100%
	}
}

#modal #modalGuide .accept-example-item .type-text {
	margin-top: 16px;
	font-size: 18px
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-example-item .type-text {
		font-size: 14px
	}
}

#modal #modalGuide .accept-example-item.type-pass {
	border: 1px solid #b2def1
}

#modal #modalGuide .accept-example-item.type-pass .type-title .ico {
	background-image: url(../images/ico_o@2x.png)
}

#modal #modalGuide .accept-example-item.type-pass .type-image-item {
	width: 420px;
	position: relative;
	margin: 32px auto 0
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-example-item.type-pass .type-image-item {
		width: 90%
	}
}

#modal #modalGuide .accept-example-item.type-pass .type-image-item .arrow {
	font-size: 14px;
	white-space: nowrap;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	position: absolute;
	right: -24px;
	top: 0;
	width: 11px;
	height: 100%;
	background: url(../images/ico_vertical_arrow@2x.png) center top/100% 100% no-repeat;
	text-indent: 10px
}

#modal #modalGuide .accept-example-item.type-fail {
	border: 1px solid #fd8882;
	margin-top: 32px;
	font-size: 18px
}

#modal #modalGuide .accept-example-item.type-fail .type-title .ico {
	background-image: url(../images/ico_x@2x.png)
}

#modal #modalGuide .accept-example-item.type-fail .type-image-list {
	margin-top: 40px
}

#modal #modalGuide .accept-example-item.type-fail .type-image-list::after {
	content: '';
	display: table;
	clear: both
}

#modal #modalGuide .accept-example-item.type-fail .type-image-item {
	width: 357px;
	float: left;
	margin-bottom: 50px
}

#modal #modalGuide .accept-example-item.type-fail .type-image-item .txt {
	margin-top: 24px
}

#modal #modalGuide .accept-example-item.type-fail .type-image-item .c-red {
	color: #e2231a
}

#modal #modalGuide .accept-example-item.type-fail .type-image-item:nth-child(even) {
	float: right
}

@media only screen and (max-width:800px) {
	#modal #modalGuide .accept-example-item.type-fail .type-image-item {
		width: 49%
	}

	#modal #modalGuide .accept-example-item.type-fail .type-image-item .txt {
		font-size: 16px
	}
}

@media only screen and (max-width:640px) {
	#modal #modalGuide .accept-example-item.type-fail .type-image-item {
		width: 100%
	}

	#modal #modalGuide .accept-example-item.type-fail .type-image-item .txt {
		font-size: 14px
	}
}

@media only screen and (max-width:640px) {
	#modal .layer {
		width: calc(100% - 40px);
		padding: 16px
	}

	#modal .modal-header h2 {
		font-size: 18px
	}
}

#cardSection01 .title-area h2,
#cardSection01 .title-area p {
	opacity: 0;
	position: relative;
	top: 50px;
	-webkit-transition: .5s;
	transition: .5s;
	font-weight: 200;
	line-height: 1.3;
}


#cardSection01 .title-area .share-sns-list {
	opacity: 0;
	-webkit-transition: .5s;
	transition: .5s;
	bottom:0;
	right:0;
	width:50%;
}

#cardSection01 .btn-join {
	bottom: -40px;
	opacity: 0;
	-webkit-transition: .5s;
	transition: .5s
}

#cardSection01.is-active .title-area h2 {
	opacity: 1;
	top: 0;
	-webkit-transition-delay: .4s;
	transition-delay: .4s;
}

#cardSection01.is-active .title-area p {
	opacity: 1;
	top: 0;
	-webkit-transition-delay: .6s;
	transition-delay: .6s
}

#cardSection01.is-active .title-area .share-sns-list {
	opacity: 1;
	-webkit-transition-delay: .8s;
	transition-delay: .8s
}

#cardSection01.is-active .btn-join {
	bottom: 15px;
	opacity: 1;
	-webkit-transition-delay: 1s;
	transition-delay: 1s
}

@-webkit-keyframes objectBrush {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	50% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}

	100% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
}

@keyframes objectBrush {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	50% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}

	100% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
}

@-webkit-keyframes objectRotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	25% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg)
	}

	50% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	75% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg)
	}

	100% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
}

@keyframes objectRotate {
	0% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	25% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg)
	}

	50% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}

	75% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg)
	}

	100% {
		-webkit-transform: rotate(0);
		transform: rotate(0)
	}
}

@-webkit-keyframes objectPalette {
	0% {
		-webkit-transform: translate(0, 0);
		transform: translate(0, 0)
	}

	50% {
		-webkit-transform: translate(0, -30px);
		transform: translate(0, -30px)
	}

	100% {
		-webkit-transform: translate(0, 0);
		transform: translate(0, 0)
	}
}

@keyframes objectPalette {
	0% {
		-webkit-transform: translate(0, 0);
		transform: translate(0, 0)
	}

	50% {
		-webkit-transform: translate(0, -30px);
		transform: translate(0, -30px)
	}

	100% {
		-webkit-transform: translate(0, 0);
		transform: translate(0, 0)
	}
}

@-webkit-keyframes objectZoom {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0)
	}

	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes objectZoom {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0)
	}

	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

#cardSection02 .about-content .join-process ul li .ico-process {
	-webkit-animation: objectRotate 2.5s linear infinite;
	animation: objectRotate 2.5s linear infinite
}

#cardSection03 .score-info .score-list li .ico {
	-webkit-transform: scale(0);
	transform: scale(0);
	opacity: 0;
	-webkit-transition: all .4s;
	transition: all .4s
}

#cardSection03 .score-info .score-list li .score-num {
	opacity: 0;
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	-webkit-transition: all 1s;
	transition: all 1s;
	-webkit-transition-delay: .8s;
	transition-delay: .8s
}

#cardSection03.is-active .score-info .score-list li .score-num {
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
	opacity: 1
}

#cardSection03.is-active .score-info .score-list li .ico {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1)
}

#cardSection03.is-active .score-info .score-list li:nth-child(2) .ico {
	-webkit-transition-delay: .3s;
	transition-delay: .3s
}

#cardSection03.is-active .score-info .score-list li:nth-child(3) .ico {
	-webkit-transition-delay: .6s;
	transition-delay: .6s
}

#cardSection04::before {
	-webkit-animation: objectPalette 3s linear infinite;
	animation: objectPalette 3s linear infinite
}

#cardSection04::after {
	-webkit-animation: objectPalette 5s linear infinite;
	animation: objectPalette 5s linear infinite
}