@charset "UTF-8";

/* ---------------------------------------------------- */
/* base */
/* 리셋, 기본 설정 */
/* ---------------------------------------------------- */

:root {
  /* color */
  --color-def: #333333;
  --color-point: #d82744; /*리뉴얼 색상 #e44a42 deep #de4a62 deepdeep #b52139 */
  --color-pointHover: #cb2540;
  --color-pointActive: #be223c;
  --color-pointLight: rgba(216,39,68,.08);
  --color-gray: #777;
  --color-lightGray: #cccaca;
  --color-midGray: #a9a9a9;
  --color-bgGray: #F9F9F9;
  --color-bgGrayLight: #fafafa;
  --color-bgGrayDeep: #e8e8e8;
  --color-lineGray: #dddddd;
  --color-lineGrayLight: #eaeaea;
  --color-warning: #ffc107;
  --color-danger: #dc3545;
  --color-success: #198754;
  --color-disabled: #c2c2c2;
  /* color - 폰트매니저 */
  --color-fontmanager-point: #ff6600; /* rgb(252, 156, 69), rgb(243, 201, 103) */
  /* size */
    --font-size-smallBtn: 1rem;
    --font-size-xSmall: 1.25rem;
    --font-size-def: 1.4rem;
    --font-size-medium: 1.55rem;
    --font-size-large: 1.85rem;
    --font-size-Xlarge: 2rem;
    --font-size-big: 2.4rem;
    --font-size-title-1: 2.65rem;
    --font-size-title-2: 3rem;
  /* webfont */
  --font-def: "210Gothic030", sans-serif;
  --font-bold: "210Gothic040", sans-serif;
  --font-bold2: "210Gothic050", sans-serif;
  /* 그 외 스타일 설정 */
  --border-width: 1px;
  --border-radius: 10px;
  --border-radius-btn: 10px;
  --border-radius-small: 4px;
  --icon-width: 1px;
}

*, *::before, *::after {
  box-sizing: border-box;
}

/* ----- 리셋 ----- */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { margin: 0; scroll-behavior: smooth; }
ul, ol, li { list-style: none; }
a, a:link, a:visited, a:hover, a:active, a:focus { text-decoration: none; color: inherit; }
button, button:active, button:focus { outline: 0; }
h1, h2, h3, h4, h5 { font-weight: normal; margin: 0; }
button { line-height: initial; font-weight: normal; }
caption, legend { position: absolute; top: 0; left: 0; overflow: hidden; width: 0; height: 0; margin: 0; padding: 0; }
u { text-underline-position: under; }
em { font-style: normal; }
fieldset[disabled] input[type=checkbox], fieldset[disabled] input[type=radio], input[type=checkbox].disabled, input[type=checkbox][disabled], input[type=radio].disabled, input[type=radio][disabled] { cursor: not-allowed; }
input:focus { outline: none; }
a { color: unset; }
table { max-width: 100%; }
/* bold제거 */
strong { font-weight: normal; }

/* ----- 기본 설정 ----- */
html {
	scroll-behavior: smooth; 
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent;
    font-size: 62.5%;
}
body {
  font-family: var(--font-def);
  font-size: var(--font-size-def);
  /* letter-spacing: 0.3125px; */
  /* font-weight: bold; 옴니 사용시 필수 */
  color: var(--color-def);
  line-height: 1.8;
  padding-top: 125px;
  overflow-y: scroll;
}
body.prevent-scroll {
  overflow: hidden;
}
@media screen and (max-width: 1124px) {
	body {
		padding-top: 105px;
	}
}
.clear:after, .clear:before {
  content: "";
  display: block;
  visibility: hidden;
  clear: both;
}
.blind {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  white-space: nowrap;
  clip: rect(0, 0, 0, 0);
}
.only_mo {
	display:none; 
}
@media screen and (max-width: 768px) {
	.only_mo {
		display:block; 
	}
}

/* 스크롤바 */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
::-webkit-scrollbar-thumb {
    outline: none;
    border-radius: 35px;
    border: 4px solid transparent;
    box-shadow: inset 4px 4px 0 var(--color-lineGray);
    transition: .25s;
}
::-webkit-scrollbar-track {
    box-shadow: none;
    background-color: transparent;
}
body::-webkit-scrollbar-thumb {
    box-shadow: inset 4px 4px 0 var(--color-point);
}

/* 드래그 */
::-moz-selection {
	background: var(--color-point); 
	color: #fff; 
	text-shadow: none; 
}
::selection { 
	background: var(--color-point); 
	color: #fff; 
	text-shadow: none; 
}

/* ----- 컨테이너 사이즈 ----- */
*[class^="container-"] {
  position: relative;
  margin-left: auto;
  margin-right: auto;
}
*[class^="container-"].hidden {
	overflow: hidden;
}
.container-1480 {
  width: 1480px;
}
@media screen and (max-width: 1520px) {
  .container-1480 {
    width: 90%;
    min-width: 240px;
  }
}
.container-1280 {
  width: 1280px;
}
@media screen and (max-width: 1320px) {
  .container-1280 {
    width: 90%;
    min-width: 240px;
  }
}
.container-1200 {
  width: 1200px;
}
@media screen and (max-width: 1240px) {
  .container-1200 {
    width: 90%;
    min-width: 240px;
  }
}
.container-1140 {
  width: 1140px;
}
@media screen and (max-width: 1180px) {
  .container-1140 {
    width: 90%;
    min-width: 240px;
  }
}
.container-900 { /* 프로모션 */
  width: 900px;
}
@media screen and (max-width: 960px) {
  .container-900 {
    width: 100%;
  }
}
.container-promotion {
  width: 900px;
}
@media screen and (max-width: 960px) {
  .container-promotion {
    width: 100%;
  }
}
.container-660 {
  width: 660px;
}
@media screen and (max-width: 768px) {
  .container-660 {
    width: 90%;
    min-width: 240px;
  }
}
.container-460 {
  width: 460px;
}
@media screen and (max-width: 520px) {
  .container-460 {
    width: 90%;
    min-width: 240px;
  }
}
/* 컨테이너 여백 추가 */
#page_font, #page_product, #page_font_preview, #page_package, #page_portfolio,
#page_mypage {
	padding-top: 45px;
	padding-bottom: 125px;
}
#page_error,
#page_estimate, #page_letter, #page_cs, #page_member, #page_view,
#page_product_detail {
	padding-top: 85px;
	padding-bottom: 125px;
}
#page_font_detail {
	padding-top: 85px;
	padding-bottom: 125px;
}
#page_error #container,
#page_letter #container,
#page_member #container,
#page_view #container {
  min-height: calc(100dvh - 660px);
}
@media screen and (max-width: 912px) {
	#page_font, #page_product, #page_font_preview, #page_package, #page_portfolio,
	#page_estimate, #page_letter, #page_cs, #page_view,
	#page_product_detail, #page_font_detail,
	#page_mypage {
		padding-top: 25px;
		padding-bottom: 65px;
	}  
	#page_error,
	#page_member {
	    padding-top: 45px;
	  	padding-bottom: 65px;
  }
}

/* hidden */
#page_font {
	overflow: hidden;
}

/* ----- 텍스트 관련 ----- */
.fs-txt-0 {
  font-size: var(--font-size-xSmall);
}
.fs-txt-1 {
  font-size: var(--font-size-def);
}
.fs-txt-2 {
  font-size: var(--font-size-medium);
  line-height: 1.8;
}
.fs-txt-3 {
  font-size: var(--font-size-large);
  line-height: 1.5;
}
.fs-txt-4 {
  font-size: var(--font-size-Xlarge);
  line-height: 1.5;
}
.fs-txt-5 {
  font-size: var(--font-size-big);
  line-height: 1.4;
}
.fs-title-1 {
  font-size: var(--font-size-title-1);
  line-height: 1.4;
}
.fs-title-2 {
  font-size: var(--font-size-title-2);
  line-height: 1.4;
}
.fs-title-3 {
  font-size: var(--font-size-title-3);
  line-height: 1.4;
}
@media screen and (max-width: 912px) {
	:root {
		--font-size-def: 1.3rem;
	}
	.fs-txt-2 {
	  font-size: var(--font-size-def);
	}
	.fs-txt-3 {
  	  font-size: var(--font-size-def);
	}
	.fs-txt-4 {
	  font-size: var(--font-size-medium);
	}
	.fs-txt-5 {
	  font-size: var(--font-size-large);
	}
  .fs-title-1 {
	  font-size: var(--font-size-large);
  }
  .fs-title-2 {
    font-size: var(--font-size-Xlarge);
  }
}
.bold {
  font-weight: normal;
  font-family: var(--font-bold);
}
.boldEx {
  font-weight: normal;
  font-family: var(--font-bold2);
}
.sub {
  color: var(--color-gray);
}
.ssub {
  color: var(--color-midGray);
}
/****/
#page_mypage .sub {
  color: var(--color-midGray);
}
.point {
  font-weight: normal;
  color: var(--color-point);
}
.txt {
  line-height: 1.8;
  text-align: justify;
  word-break: break-all;
}
.txt.center {
  text-align: center;
}
p.txt {
  margin: 0;
}
strong.cm_tip {
	display: inline-block;
}
.txt_through {
	text-decoration: line-through;
}
.cm_tip {
/*   font-family: var(--font-bold); */
  line-height: 1.8;
/*   font-size: var(--font-size-xSmall); */
}
.cm_tip.point {
  color: var(--color-point);
}
.cm_tip.gray {
  color: var(--color-gray);
}
.underline {
text-decoration: underline !important;
    text-underline-offset: 5px;
}
dt {
	font-weight: normal;
}
/* padding */
.pd-top-5 {
	padding-top: 5px;
}
.pd-top-10 {
	padding-top: 10px;
}
.pd-top-15 {
	padding-top: 15px;
}
.pd-top-25 {
	padding-top: 25px;
}
.pd-top-35 {
	padding-top: 35px;
}
.pd-bt-5 {
	padding-bottom: 5px;
}
.pd-bt-10 {
	padding-bottom: 10px;
}
.pd-bt-15 {
	padding-bottom: 15px;
}
.pd-bt-25 {
	padding-bottom: 25px;
}
.pd-bt-35 {
	padding-bottom: 35px;
}
.pd-lf-5 {
	padding-left: 5px;
}
.pd-lf-10 {
	padding-left: 10px;
}
.pd-rt-5 {
	padding-left: 5px;
}
.pd-rt-10 {
	padding-left: 10px;
}
/* 옴니고딕 bold
#menu-tab, .item-preview-box-input, .item-preview-box, .container, .corporate, .container_font {
	font-weight: bold;
} */