@charset "utf-8";
/* hanbom.com */

/* border-box */
div, article, aside, footer, header, hgroup, main, menu, nav, section,
h1, h2, h3, h4, h5, h6, p,
ul, ol, li,
nav, a, button,
label, input,
select, textarea {
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

/* blind */
.blind,
.ico > span {visibility: hidden; overflow: hidden; position: absolute; top: -1px; left: -1px; width: 1px; height: 1px; font-size: 0; line-height: 0; z-index:-1;}

/* a */
a,
a:link,
a:visited,
a:active,
a:hover			{text-decoration: none; color: inherit;}

/* only */
.only-pc{display: block;}
.only-mo{display: none;}
@media all and (max-width: 768px) {
	.only-pc{display: none;}
	.only-mo{display: block;}
}


/* inner */
@media all and (min-width:1681px) {
	.inner-wrap,
	.inner{padding-left: 122px; padding-right: 122px;}
}
@media all and (min-width:1281px) and (max-width: 1680px) {
	.inner-wrap,
	.inner{padding-left: 7.262vw; padding-right: 7.262vw;}
}
@media all and (min-width:961px) and (max-width: 1280px) {
	.inner-wrap,
	.inner{padding-left: 5.469vw; padding-right: 5.469vw;}
}
@media all and (min-width:769px) and (max-width:960px){
	.inner-wrap{padding-left: 35px; padding-right: 35px;}
	.inner{padding-left: 42px; padding-right: 42px;}
}
@media all and (max-width:768px) {
	.inner-wrap{padding-left: 16px; padding-right: 16px;}
	.inner{padding-left: 24px; padding-right: 24px;}
}

/* title */
.page-title{ font-weight: 700; line-height: 1.4;}
.section-title{ font-weight: 700; line-height: 1.2;}
@media all and (min-width:961px) {
	.page-title{font-size: 86px;}
	.section-title{font-size: 50px;}
}
@media all and (min-width:769px) and (max-width:960px) {
	.page-title{font-size: 70px;}
	.section-title{font-size: 45px;}
}
@media all and (max-width:768px) {
	.page-title{font-size: 36px;line-height: 1.69;}
	.section-title{font-size: 40px; line-height: 1.24;}
}

/* text-wrap */
.text-wrap{}
.text-wrap .title{font-size: 24px; font-weight: 700;}
.text-wrap .text{font-size: 18px; line-height: 1.56;}
.text-wrap .text + .text{padding-top: 8px;}
/* text-wrap title size */
@media all and (max-width: 769px) {
	.text-wrap .text{cfont-size: 18px; line-height: 1.56;}
}
@media all and (max-width: 768px) {
	.text-wrap .text{font-size: 16px; line-height: 1.63;}
}


/* image */
.img-wrap,
.img-wrap picture{width: 100%; }
img {vertical-align: top; width: 100%; height: 100%; object-fit: cover;
	-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; 
}

/* font weight */
strong,
.fw-700 {font-weight: 700}

/* font color */
.fc-white{color: var(--white);}
.fc-black{color: var(--black) !important;}

/* background-color */
.bg-sky{background-color: var(--sky);}
.bg-apricot{background-color: var(--apricot);}
.bg-levender{background-color: var(--levender);}

/* text deco */
.underline	{text-decoration: underline;}
/* ico */
.ico		{display: inline-block; background-color: transparent; background-repeat: no-repeat; background-position : 50% 50%; background-size: contain;
			-webkit-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease;
			}
.ico.download,
.ico.download-w,
.ico.arr-left,
.ico.arr-down {width: 16px; height: 16px;}
.ico.download	{background-image: url('../images/common/ico_download.svg');}
.ico.download-w	{background-image: url('../images/common/ico_download-w.svg');}
.ico.arr-left	{background-image: url('../images/common/ico_arr_left.svg');}
.ico.arr-down	{background-image: url('../images/common/ico_arr_down.svg');}

.ico.arr-left-g,
.ico.arr-left-v,
.ico.arr-left-w {width: 20px; height: 20px;}
.ico.arr-left-g	{background-image: url('../images/common/ico_arr_left-g.svg');}
.ico.arr-left-v	{background-image: url('../images/common/ico_arr_left-v.svg');}
.ico.arr-left-w	{background-image: url('../images/common/ico_arr_left-w.svg');}

.ico.close,
.ico.magnifier,
.ico.link,
.ico.menu,
.ico.menu-w,
.ico.arr-big-down,
.ico.arr-big-up{width: 24px; height: 24px;}
.ico.close	{background-image: url('../images/common/ico_close.svg');}
.ico.magnifier {background-image: url('../images/common/ico_magnifier.svg');}
.ico.link {background-image: url('../images/common/ico_link.svg');}
.ico.menu {background-image: url('../images/common/ico_menu.svg');}
.ico.menu-w {background-image: url('../images/common/ico_menu-w.svg');}
.ico.arr-big-down {background-image: url('../images/common/ico_arr_big_down.svg');}
.ico.arr-big-up {background-image: url('../images/common/ico_arr_big_up.svg');}

.ico.pop-close{width: 36px; height: 36px; background-image: url("../images/common/ico_pop_close.svg");}

.ico.instar,
.ico.kko,
.ico.youtube,
.ico.facebook{width: 40px; height: 40px;}
.ico.instar{background-image: url("../images/common/ico_instar.svg");}
.ico.kko{background-image: url("../images/common/ico_kko.svg")}
.ico.youtube{background-image: url("../images/common/ico_youtube.svg")}
.ico.facebook{background-image: url("../images/common/ico_facebook.svg")}

.ico.business-1,
.ico.business-1-1,
.ico.business-2,
.ico.business-2-1,
.ico.business-3,
.ico.business-3-1,
.ico.business-4,
.ico.business-4-1,
.ico.business-5,
.ico.business-6,
.ico.business-7,
.ico.business-8,
.ico.business-9,
.ico.business-10,
.ico.business-11,
.ico.business-12,
.ico.business-13,
.ico.business-14,
.ico.business-15,
.ico.business-16{width: 78px; height: 78px;}
.ico.business-1 {background-image: url("../images/common/ico_business-1.svg");}
.ico.business-1-1{background-image: url("../images/common/ico_business-1-1.svg");}
.ico.business-2{background-image: url("../images/common/ico_business-2.svg");}
.ico.business-2-1{background-image: url("../images/common/ico_business-2-1.svg");}
.ico.business-3{background-image: url("../images/common/ico_business-3.svg");}
.ico.business-3-1{background-image: url("../images/common/ico_business-3-1.svg");}
.ico.business-4{background-image: url("../images/common/ico_business-4.svg");}
.ico.business-4-1{background-image: url("../images/common/ico_business-4-1.svg");}
.ico.business-5{background-image: url("../images/common/ico_business-5.svg");}
.ico.business-6{background-image: url("../images/common/ico_business-6.svg");}
.ico.business-7{background-image: url("../images/common/ico_business-7.svg");}
.ico.business-8{background-image: url("../images/common/ico_business-8.svg");}
.ico.business-9{background-image: url("../images/common/ico_business-9.svg");}
.ico.business-10{background-image: url("../images/common/ico_business-10.svg");}
.ico.business-11{background-image: url("../images/common/ico_business-11.svg");}
.ico.business-12{background-image: url("../images/common/ico_business-12.svg");}
.ico.business-13{background-image: url("../images/common/ico_business-13.svg");}
.ico.business-14{background-image: url("../images/common/ico_business-14.svg");}
.ico.business-15{background-image: url("../images/common/ico_business-15.svg");}
.ico.business-16{background-image: url("../images/common/ico_business-16.svg");}

.ico.etc-1{width: 140px; height: 140px; background-image: url("../images/common/ico_etc-1.svg");}
.ico.etc-2{width: 154px; height: 154px; background-image: url("../images/common/ico_etc-2.svg");}
.ico.etc-3{width: 132px; height: 194px; background-image: url("../images/common/ico_etc-3.svg");}
.ico.etc-4{width: 300px; height: 300px; background-image: url("../images/common/ico_etc-4.svg");}


/* ellipsis */
.ellipsis,
.ellipsis-2 {
	display: -webkit-box; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; -webkit-box-orient: vertical; word-wrap: break-word;
}
.ellipsis{line-height: 1.25rem; height: 1.25rem; -webkit-line-clamp: 1;}
.ellipsis-2 {height: 54px; -webkit-line-clamp: 2;}

/* align */
.ta-c {text-align: center !important;}
.ta-l {text-align: left !important;}
.ta-r {text-align: right !important;}

/* transform */
.rotate{-webkit-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg);}

/* tabs */
.tabs,
.tabs a					{
	display: -ms-flexbox; display: -webkit-box; display: flex;
}
.tabs li + li 				{margin-left: 100px;}
.tabs a 					{position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0; cursor: pointer; text-align: center; text-decoration:none;
	color: var(--black-op-3); font-size: 32px; font-weight: 600; line-height: 1.03;
	-webkit-transition: color 0.3s ease;-o-transition: color 0.3s ease;transition: color 0.3s ease;
	-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
	-webkit-touch-callout: none; -khtml-user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	
	
}
.tabs a:hover,
.tabs li.current a{color: var(--violet);}

.tab-content{display: none;}
.tab-content.active{display: block;}

/* flex */
[class*="flex"]	{
	display: -webkit-box;display: -ms-flexbox;display: flex;
	-webkit-box-align: center;-ms-flex-align: center;align-items: center; 
}
.flex-normal{-webkit-box-align: baseline;-ms-flex-align: baseline;align-items: baseline;}
.flex-start{-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;}
.flex-center{-webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.flex-end{-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;}
.flex-between{-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}

@media all and (max-width: 960px) {
	.flex-column{-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
}

/* pagination */ 
.pagination		{}
.pagination ul,
.pagination li		{}
.pagination a		{}
.pagination a.prev		{}
.pagination a.next		{}
.pagination a:hover		{}
.pagination li.active a	{}

/* col */
[class*="col-"]{
	display: -webkit-box; display: -ms-flexbox; display: flex; 
	-webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;
	-ms-flex-wrap: wrap;flex-wrap: wrap;
}
.col-2{width: calc(100% + 52px); margin-top: -26px; margin-left: -26px;}
.col-2 li{margin: 26px; width: calc((100% - 104px) / 2);}
.col-3{width: calc(100% + 52px); margin-top: -40px; margin-left: -26px;}
.col-3 li{margin: 40px 26px; width: calc((100% - 156px) / 3);}
.col-4{width: calc(100% + 52px); margin-top: -18px; margin-left: -26px;}
.col-4 li{margin: 18px 26px; width: calc((100% - 208px) / 4);}
@media all and (max-width: 768px) {
	.col-2,
	.col-3,
	.col-4{width: 100%; margin-top: 0; margin-left: 0;}
	.col-2 li,
	.col-3 li,
	.col-4 li{margin: 0; width: 100%;}
	/* .col-2 li + li,
	.col-2 div + div{margin-top: 20px;}
	.col-4 li + li,
	.col-4 div + div{margin-top: 34px;} */
}

/* data-list */
.data-list{}
.data-list li + li{}


