@charset "UTF-8";

/***** Fonts *****/
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/static/pretendard.css");


/***** reset *****/
* {box-sizing:border-box; margin:0; padding:0; font-family:"Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
body,
h1, h2, h3, h4, h5, h6,
ul, ol, dl, dd,
p,
fieldset, legend {margin:0; padding:0;}
ul, ol {list-style:none;}
table {border-collapse:collapse;}
em {font-style:normal;}
a {color:inherit; text-decoration:none;}
img {vertical-align:top;}
body, input, textarea, select, button {font-size:14px; font-family:"Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
fieldset, button {border:none; outline:none;}
button:hover {cursor:pointer;}

.hidden, .blind { position: absolute !important; top: auto !important; left: auto !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; text-indent: 0px !important;
}


html, html body {display:flex;width:100%;min-height:100%;}

.dis_table{display:table;width:100%;height:100%;}
.dis_table_cell{display:table-cell;width:100%;height:100%;font-size:0;}
.col{font-size:inherit;color:#1CABE2;letter-spacing:inherit;line-height:inherit;font-weight:inherit;vertical-align:baseline;}
.eg{font-size:inherit;color:inherit;letter-spacing:-1px;line-height:inherit;font-weight:inherit;vertical-align:baseline;}

.w_pc{display:block;}
.w_mobile{display:none;}

.wrap{
	width:100%;
	min-width:1280px;
	height: 100%;
}

.wrap .set01 {
	position:relative; display: flex; flex-direction: column;
	gap: 50px; width:100%; height: 100%; padding: 90px;
	background:#e8ecef url("../images/bracelet_pc.jpg") no-repeat center top;background-size:cover;
}

.wrap .logo_set {}
.wrap .logo_set a {display:block;width:111px;height: 59px;background: url("../images/logo_sky.png") no-repeat left top;background-size: contain;}

.wrap .tit_set {position: relative; z-index: 3;}
.wrap .tit_set .tit {color: #1CABE2;font-size: 41px;line-height: 140%;font-weight: 800;letter-spacing: 0;margin: 0 0 32px;}
.wrap .tit_set .txt {color: #131313;font-size: 17px;line-height: 150%;font-weight: 500;}
.wrap .tit_set .txt p {margin-bottom: 22px;}
.wrap .tit_set .txt p:last-child {margin-bottom: 0;}
.wrap .tit_set .col_red {position: relative;color: #F16262;font-weight: 700;line-height: 150%;padding-left: 13px;}
.wrap .tit_set .col_red::before {content:'';position: absolute;left: 1px;top: 8px;z-index: 0;width: 6px;aspect-ratio: 1/1;background: url('data:image/svg+xml,<svg width="6" height="6" viewBox="0 0 6 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.60237 6L0.818991 5.40923L1.94065 3.48923L0 2.65846L0.320475 1.71692L2.35015 2.23385L2.52819 0H3.48961L3.66766 2.21538L5.69733 1.71692L6 2.65846L4.05935 3.48923L5.19881 5.40923L4.41543 6L3.0089 4.24615L1.60237 6Z" fill="%23F16262"/></svg>') no-repeat left center;background-size: contain;}
.wrap .tit_set div p, .wrap .tit_set div span {color: inherit;font-size: inherit;line-height: inherit;font-weight: inherit;vertical-align: baseline;}

.wrap .tit_set .txt_bg {position: relative;z-index: 0;display: inline-block;color: #fff;margin: 0 6px 0 0;}
.wrap .tit_set .txt_bg::before {content: '';position: absolute;top: 50%;left: 50%;z-index: -1;width: calc(100% + 10px);height: 54px;background: #1CABE2;
	-webkit-transform: translate(-50%, calc(-50%));
	-moz-transform: translate(-50%, calc(-50%));
	-o-transform: translate(-50%, calc(-50%));
	transform: translate(-50%, calc(-50%));
}
.wrap .size_set {margin: 40px 0 0;}
.wrap .size_set .tit {position: relative;padding-left: 0;margin-bottom: 15px;}
/* .wrap .size_set .tit {position: relative;padding-left: 43px;margin-bottom: 15px;} */
/* .wrap .size_set .tit::before {content:'';position: absolute;left: 0;top: 50%;z-index: 1;width: 22px;height: 2px;background: #1CABE2;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
} */
.wrap .size_set .tit p {color: #1CABE2;font-size: 18px;line-height: 22px;font-weight: 700;}
.wrap .size_set .txt p {color: #000;font-size: 16px;font-weight: 400;line-height: 150%;}
.wrap .size_set div p, .wrap .size_set div span {color: inherit;font-size: inherit;line-height: inherit;font-weight: inherit;vertical-align: baseline;}
.wrap .size_set .txt p > span {display: block;color: #000;font-size: 16px;font-weight: 400;line-height: 150%;margin-bottom: 10px;}
.wrap .size_set .txt p > span:last-child {margin-bottom: 0;}
.wrap .size_set .txt .bold {font-weight: 700;}

.wrap .btn_set {display: block;}
.wrap .btn_set .btn_cta {display: inline-block;width: 297px;height: auto;background: #1CABE2;padding: 22px 27px;margin: 0;}
.wrap .btn_set .btn_cta span {display: block;color: #fff;font-size: 18px;font-weight: 500;line-height: 140%;}
.wrap .btn_set .btn_cta span:nth-child(1) {margin-bottom: 3px;}
.wrap .btn_set .btn_cta span:nth-child(2) {font-size: 27px;font-weight: 900;letter-spacing: -0.02em;background: url('data:image/svg+xml,<svg width="14" height="22" viewBox="0 0 14 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.69531 2L10.4987 10.8034L1.69531 19.6068" stroke="white" stroke-width="4"/></svg>') no-repeat right center;background-size: auto 22px;padding-right: 40px;}


@media all and (max-width:750px){
	html {font-size:2.666666666666667vw; }
	.wrap {min-width:100%;}
	.w_pc {display:none;}
	.w_mobile {display:block;}

	.wrap {display:block;height: auto; background-color: #e8ecef; }
	.wrap .set01 {
		height: auto; padding: 4rem 3.2rem 4rem 2.4rem; gap: 0;
		background:url("../images/bracelet_mo.jpg") no-repeat right top; background-size: 100%;
	}

	.wrap .logo_set a {width: 7.6rem;height: 4rem;}

	.wrap .tit_set .tit {font-size: 2.1rem;margin: 5.6rem 0 2rem;}
	.wrap .tit_set .txt {font-size: 1.4rem;line-height: 160%;font-weight: 300;letter-spacing: -0.04em;}
	.wrap .tit_set .col_red {font-size: 1.2rem;padding-left: 1.2rem;}
	.wrap .tit_set .col_red::before {left: 0;top: 0.7rem;width: 0.6rem;}
	.wrap .tit_set .txt p {margin-bottom: 0.7rem;}
	.wrap .tit_set .txt_bg {}
	.wrap .tit_set .txt_bg::before {
		width: calc(100% + 0.6rem);height: 2.9rem;
		-webkit-transform: translate(-50%, calc(-50% + 1px));
		-moz-transform: translate(-50%, calc(-50% + 1px));
		-o-transform: translate(-50%, calc(-50% + 1px));
		transform: translate(-50%, calc(-50% + 1px));
	}

	.wrap .size_set {margin: 2.3rem 0 0;}
	.wrap .size_set .tit {padding-left: 0;margin-bottom: 0.8rem;}
	.wrap .size_set .tit::before {content: none;}
	.wrap .size_set .tit p {font-size: 1.4rem;line-height: 160%;letter-spacing: -0.04em;}
	.wrap .size_set .txt p {font-size: 1.3rem;font-weight: 300;line-height: 160%;letter-spacing: -0.04em;}
	.wrap .size_set .txt p > span {font-size: 1.3rem;font-weight: 300;line-height: 160%;letter-spacing: -0.04em;margin-bottom: 0.8rem;}

	.wrap .btn_set { margin: 4rem 0;}
	/* .wrap .btn_set {display: none;} */
}
