@charset "utf-8";

html{
	padding-bottom: 0px;
	color:#141414;
}

.hr90 {
	transform:rotate(90deg);
	-o-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-webkit-transform:rotate(90deg);

	margin:5px 0;
	border:0;
	border-top:2px solid rgba(0,0,0,0.3);
}

hr.vertical {
  width: 0px;
  height: 100%;
  /* or height in PX */
}



.w5 {
	width: 5% !important;
}
.w10 {
	width: 10% !important;
}
.w15 {
	width: 15% !important;
}
.w20 {
	width: 20% !important;
}
.w25 {
	width: 25% !important;
}
.w30 {
	width: 30% !important;
}
.w35 {
	width: 35% !important;
}
.w40 {
	width: 40% !important;
}
.w45 {
	width: 45% !important;
}
.w50 {
	width: 50% !important;
}
.w55 {
	width: 55% !important;
}
.w60 {
	width: 60% !important;
}
.w65 {
	width: 65% !important;
}
.w70 {
	width: 70% !important;
}
.w75 {
	width: 75% !important;
}
.w80 {
	width: 80% !important;
}
.w85 {
	width: 85% !important;
}
.w90 {
	width: 90% !important;
}
.w95 {
	width: 95% !important;
}
.w100 {
	width: 100% !important;
}

.pb-200{
	padding-bottom:200px !important;
}

.f-left {
	float: left;
}

.container{
	margin:0 auto;
	padding:0;
}

.container-fluid{
	width:100%;
	padding:0;
}

.center{
	text-align:center;
	margin:0 auto;
}

a:hover,.navbar-nav>.color-blue {
	color: #18B8FF;
}

.letter-0{
	letter-spacing:0px;
	font-size:0.813rem;
}

#header > .container{
	height:100%;
	align-items:unset;
}

.a03 {
	-webkit-transition-duration:0.3s !important;
	-webkit-transition-delay:0s !important;
	-webkit-transition-timing-function:ease-in-out !important;
	transition-duration:0.3s !important;
	transition-delay:0s !important;
	transition-timing-function:ease-in-out !important;
}

.a05 {
	-webkit-transition-duration:0.5s !important;
	-webkit-transition-delay:0s !important;
	-webkit-transition-timing-function:ease-in-out !important;
	transition-duration:0.5s !important;
	transition-delay:0s !important;
	transition-timing-function:ease-in-out !important;
}

#parallax{
	position: fixed;
	width:100%;
	top:60px;
}
#overflow{
	position: relative;
	top: 0;
	width: 100%;
	background-color:#E7E7E7;
}


#newsHead{
/*
	transition-property: opacity;
*/
}

.no_bx{
	height:400px;
	width:200px;
	font-size:1rem;
}

.texta {
	/* 한 줄 자르기 */
	display: inline-block;
	width: 200px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	/* 여러 줄 자르기 추가 스타일 */
	white-space: normal;
	line-height: 1.2;
	height: 3.6em;
	text-align: left;
	word-wrap: break-word;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}



.dropdown-menu{
/*
	position:absolute;
	z-index:8000;
	padding-left:1rem;
	text-align:left;
	width:325px;
	height:650px;
	left:1rem;
	*/
	min-width:180px;
	max-width:325px;
	width:320px;
	left:auto;
	right:2%;
}
.dropdown-toggle img{
	width:30px;
	height:30px;
	border-radius:50%;
	margin-bottom:2px;
}
.dropdown-toggle img:nth-child(1){
	position:absolute;
	opacity:1;
}
.dropdown-toggle img:nth-child(2){
	position:relative;
	opacity:0;
}
.dropdown-toggle:hover>img:nth-child(1){
	opacity:0;
}
.dropdown-toggle:hover>img:nth-child(2){
	opacity:1;
}
.dropdown-toggle:after{
	content:unset;
}

.nav-link{
	margin-left:1.5rem;
	color:#141414;
}
.nav-link.collapsed{
	margin-left:0;
}
#m-menu .nav-item, .dropdown{
	background-color:#FFFFFF;
}

.top-div{
	z-index:9999;
	width:100%;
	height:60px;
	padding:0;
/*
	box-shadow:0px 5px 5px rgba(0,0,0,0.1);
*/
	background-color:rgba(255,255,255,0.4);
	position:fixed;
	left:0px;
}

.top-div:hover{
	background-color:rgba(255,255,255,1);
}

.top-menu{
	font-family:'Roboto';
	font-size: 0.75rem;
	line-height: 2rem;
	letter-spacing: 2px;
	font-weight: 800;
	top:35px;
	margin-top:0.5rem;
	margin-right:50px;
	float:right;
	flex-grow:0 !important;
	letter-spacing:2px;
}

#m-menu.show{
  display: block;
  opacity: 1;
  background-color:white;
  width:100%;
}

.navbar-toggler{
	height:100%;
	position:relative;
}

.f-wrap{
	flex-wrap:wrap;
}

.header_position_down{
	top:0px;
}

.header_position_up{
	top:-20px;
}

.lang{
	cursor:pointer;
}

.lang:hover{
	color:#00BEED;
}

.container-head{
	height:40px;
}

.color_b{
	color:#18B8FF;
}

.color_black{
	color:#141414;
}

.color_black2{
	color:#848484;
}

.color_black3{
	color:#B4B4B4;
}

.color_white{
	color:#FFFFFF;
}

.color_white2{
	color:#E7E7E7;
}

.color_white3{
	color:#D2D2D2;
}

.bg_black{
	background-color:#141414;
}

.bg_black2{
	background-color:#848484;
}

.bg_black3{
	background-color:#B4B4B4;
}

.bg_white{
	background-color:#FFFFFF;
}

.bg_white2{
	background-color:#E7E7E7;
}

.bg_white3{
	background-color:#D2D2D2;
}

.bg_blue{
	background-color:#18B8FF;
}

.line_blue{
	border-top:solid 1px #18B8FF;
}

.line_black{
/*	border-bottom:1px solid #000000;*/
}

.section_bar{
	align-self:center;
	margin:0 auto;
	min-height:40px;
	display:flex;
	z-index:1000;
	padding:0 10px;
}

@keyframes opp{
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}

iframe{
	border:0;
}

.title-div{
	z-index:1000;
	width:100%;
	padding:0;
	background-color:rgba(255,255,255,0.4);
	position:fixed;
	left:0px;
	top:60px;
}

.section_bar_contents{
	display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	height:100%;
	min-height:40px;
}

.bar_title{
	align-self:center;
	font-size:0.875rem;
	font-weight:bold;
	overflow:hidden;
	height:100%;
	display:flex;
	align-items:center;
	flex:1;
}

.bar_contents{
	font-size:0.875rem;
	color:#B4B4B4;
	text-align:center;
	margin:0 auto;
	align-self:center;
}

.bar_button{
	align-self:center;
	text-align:right;
}

.bar_date{
	font-size:0.750rem;
	font-weight:normal;
	align-self:center;
}

#m-menu{

}

.section_line{
	align-self:center;
}

.btn_area{
	position:relative;
	align-self:center;
	line-height:1;
}

.btn_white{
	color:#141414;
	background:#FFFFFF;
}

.btn_black{
	color:#FFFFFF;
	background:#141414;
}


.section{
	width:100%;
}

.section_header{
	height:124px;
	margin:0 auto;
	margin-bottom:60px;
}


.btn{
	font-size:0.688rem;
	border-radius:0;
}

.btn:hover{
	background:#18B8FF;
	/*
	border-bottom-left-radius: 10px 10px;
	border-top-left-radius: 10px 10px;
	border-top-right-radius: 10px 10px;
	*/
	color:#FFFFFF;
}
.btn:focus{
	outline:none;
	box-shadow:none;
}

.fake_btn:hover{
	background:unset;
	color:unset;
}
.fake_btn:focus{
	outline:none;
	box-shadow:none;
}
.btn_contents{
/*
	vertical-align:middle;
	*/
}

.sub_header{
	position:relative;
	width:100%;
	height:325px;
	z-index:-1;
	word-break:keep-all;
}


.sub_right{
	text-align:right;
}

.sub_header p{
	position:relative;
	display:block;
	font-size:0.875rem;
	top:70%;
	word-break:keep-all;
}

.section_title{
	font-weight:bold;
	letter-spacing:1px;
	position:relative;
	font-size:1.875rem;
	font-family:'Roboto', 'Noto Sans KR', Noto Sans, 'Noto Sans JP', 'Noto Sans TC', sans-serif !important;
}


.head_title{
	top:55%;
}

.box_area{
	padding:0 7px;
}

.box{
	background:#FFFFFF;
	box-sizing: border-box;
	padding:0;
	margin:0 auto 16px auto;
	padding:7px 7px 0 7px;
	font-size:0;
	border:1px solid #FFFFFF;
}

.box:hover{
/*
	border-bottom-left-radius: 10px 10px;
	border-top-left-radius: 10px 10px;
	border-top-right-radius: 10px 10px;
	box-shadow:2px 2px 4px rgba(0,0,0,0.5);
*/
	border:1px solid #000000;
	background:#FFFFFF;
}

.box a:hover{
	text-decoration:none;
}

.box_bar{
	margin:5px 0;
	border:0;
	border-top:1px solid rgba(0,0,0,0.3);
}

.center_bar{
	margin:15px auto;
	padding:15px;
	border:0;
	/*
	border-top:2px solid rgba(0,0,0,1);
	*/
}

.box .news_content{
	height:80px;
	padding:0 10px;
	overflow: hidden;
	color:#AAAAAA;
}

.reg_date{
	color:#848484;
	padding-bottom:10px;
	font-size:0.625rem;
	line-height:1rem;
}

.product_title{
	font-size:0.688rem;
	width:70%;
	height:1rem;
	line-height:1rem;
	overflow:hidden;
	color:#0C7CED;
}


.product_subject{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}

.box img{
/*
	border-top-left-radius: 10px 10px;
	border-top-right-radius: 10px 10px;
*/
	width:100%;
	max-width:320px;
	max-height:150px;
}

.news_title{
	font-size:0.875rem;
	font-weight:bold;
	color:#141414;
	height:2.375rem;
	overflow:hidden;
	word-break:break-word;
}

.section_view{
	top:100px;
}

.info{
	display:flex;
	justify-content:space-between;
	padding:15px;
	margin-top:32px;
	flex-wrap:wrap;
}

.info_sub{
	border-left:2px solid #848484;
	padding-left:10px;
}

.btn_lang_area{
	
}

.btn_reset{
	align-self:center;
	display:flex;
	height:100%;
	justify-content:flex-end;
}

.reset_label{
	position:relative;
	border-radius:5px;
	padding:0 5px;
	font-size:0.688rem;
	width:60px;
	left:-10px;
	margin-left:-60px;
	display:inline-block;
	cursor:pointer;
}

.reset_label img{
	width:12px;
	height:12px;
	align-self:center;
}

.font-ko{
	font-family:'Noto Sans KR', Noto Sans, 'Roboto', 'Noto Sans TC', 'Noto Sans JP', sans-serif !important;
}
.font-en{
	font-family:'Roboto', 'Noto Sans KR', Noto Sans, 'Noto Sans TC', 'Noto Sans JP', sans-serif !important;
}
.font-ja{
	font-family:'Noto Sans JP', 'Noto Sans KR', Noto Sans, 'Roboto', 'Noto Sans TC', sans-serif !important;
}
.font-ch{
	font-family:'Noto Sans TC', 'Noto Sans KR', Noto Sans, 'Roboto', 'Noto Sans JP', sans-serif !important;
}

#footer{
	position:relative;
	width:100%;
	background:#141414;
	height:150px;
	padding-top:21px;
}

#footer footer{
	margin:0 auto;
	color:#c9c9c9;
	text-align:center;
	padding-top:20px;
}

.footer_bar{
	border:0;
	border-top:0px solid #B4B4B4;
	margin-top:1rem;
	margin-bottom:0.5rem;
}

.footer_contents{
	color:#848484;
	font-size:0.750rem;
}

.footer_contents_left{
	margin-right:0.2rem;
}

.footer_contents_both p{
	margin-bottom:0;
}

.footer_contents_both{
	color:#848484;
	font-size:0.750rem;
	display:inline-flex;
	margin-bottom:0;
	flex-direction:column;
}

.familySiteWrap{
	height:150px;
	position:absolute;
	width:100%;
	bottom:0px;
}

.familySite{
	height:120px;
	list-style:none;
	margin:0 auto;
	padding:0;
	text-align:center;
	width:45%;
	justify-content:space-between;
	align-items:center;
}

/*
.familySite .familyimg01:last-child{
	display:none;
}
.familySite a:hover .familyimg01:first-child{
	display:none;
}
.familySite a:hover .familyimg01:last-child{
	display:inline-block;
}

.familySite .familyimg02:last-child{
	display:none;
}
.familySite a:hover .familyimg02:first-child{
	display:none;
}
.familySite a:hover .familyimg02:last-child{
	display:inline-block
}

.familySite .familyimg03:last-child{
	display:none;
}
.familySite a:hover .familyimg03:first-child{
	display:none;
}
.familySite a:hover .familyimg03:last-child{
	display:inline-block
}

.familySite .familyimg04:last-child{
	display:none;
}
.familySite a:hover .familyimg04:first-child{
	display:none;
}
.familySite a:hover .familyimg04:last-child{
	display:inline-block
}
*/

.align-middle{
	align-self:center;
}

.familySite a{
}

.family-logo{
	filter:  brightness(0.3) opacity(1) grayscale(1);
	-webkit-filter: brightness(0.3) opacity(1) grayscale(1);
	-moz-filter: brightness(0.3) opacity(1) grayscale(1);
	-o-filter: brightness(0.3) opacity(1) grayscale(1);
	max-width:200px;
}

.family-logo:hover{
	filter:none;
}

.family-logo1, .family-logo2, .family-logo3, .family-logo4{
	background-color:#141414;
}
.familyimg01, .familyimg02, .familyimg03, .familyimg04{
	height:65px;
	margin:0 auto;
	width:100%;
}

.familylogo{
	width:46px;
	height:46px;
	overflow:hidden;
	border-radius:30px;
	display:flex;
}
.familySite a{
	text-decoration:none;
}
.familyimg01:hover{
	width:250px;
	height:auto;
	background-color:#18B8FF;
}
.familyimg02:hover{
	width:250px;
	height:auto;
	background-color:#0C7CED;
}
.familyimg03:hover{
	width:250px;
	height:auto;
	background-color:#1DA1F2;
}
.familyimg04:hover{
	width:250px;
	height:auto;
	background-color:#FF0000;
}
.familylogo img{
	width:36px;
	height:36px;
}
figure{
	background-color:#FFFFFF;
	border-radius:100%;
	margin:0;
	padding:5px;
	align-self:center;
}
.familylogo span{
	white-space:nowrap;
	width:175px;
}

.family-logo1:hover{
	background-color:#0459A1;
}
.family-logo2:hover{
	background-color:#00BEED;
}
.family-logo3:hover{
	background-color:#3A5DAA;
}
.family-logo4:hover{
	background-color:#FF0000;
}

.tail_copyright{
	font-size:0.750rem;
	height:30px;
	text-align:center;
	line-height:1.8rem;
}


/*
@media only screen and (min-width:1024px){
	.container{
		width:1400px;
	}
	#footer footer{
		width:1400px;
	}
}
@media only screen and (max-width:1024px){
	.container{
		width:100%;
	}
	#footer footer{
		width:100%;
	}
}
*/

#to-top{
	display:block;
	position:fixed;
	text-align:center;
	line-height:12px;
	right:17px;
	bottom:90px;
	color:#FFFFFF;
	cursor:pointer;
	height:30px;
	width:30px;
	background-color:rgba(0,0,0,0.25);
	background-repeat:no-repeat;
	background-position:center;
	z-index:9999;
	border-radius:3px;
}

#to-top:hover{
	background-color:#18B8FF;
}

#to-top i{
	line-height:29px;
	width:29px;
	height:29px;
	font-size:14px;
	top:0;
	left:0;
	text-align:center;
	position:relative;
	background-color:transparent;
}

#g-recaptcha div{
	z-index:9999;
}

@media only screen and (min-width:575px){
	.footer_bar{
		width:575px;
	}
	.footer_contents_both{
		flex-direction:row;
	}
}

@media only screen and (min-width: 768px){
	.familySite{
		width:100%;
	}
	.family-logo1, .family-logo2, .family-logo3, .family-logo4{
		flex:0 0 23%;
	}
}

@media only screen and (min-width: 992px){
	#m-menu{
		display:none !important;
	}

	.dropdown-menu{
	}
	.navbar-nav .dropdown-menu{
		font-size:0.813rem;
		min-width:unset;
		letter-spacing:0px;
	}

	.familySiteWrap{
		height:150px;
	}
	.familySite{
		width:80%;
	}
	.stext{
		display:none;
	}
}
@media only screen and (min-width:1025px){
	.section_header{
		width:1100px;
	}

	.line{
		width:780px;
	}
}

@media only screen and (min-width:1200px){
	.familySite{
		width:70%;
	}
}

@media only screen and (min-width:1500px){
	.familySite{
		width:55%;
	}
	.box img{

	}
}

@media only screen and (max-width:1024px){
	.section_header{
		width:100%;
	}

	.line{
		width:100%;
	}
}

@media only screen and (max-width:991px){
	.familylogo{
		display:none;
	}
}

@media only screen and (max-width:767px){
	#g-recaptcha .grecaptcha-badge{
		z-index:9999;
		bottom:90px !important;
		display:none;
	}
	.familySiteWrap{

	}

	#to-top {
		bottom:30px;
	}

	.familySite{
		width:100%;
		height:120px;
	}

	.family-logo{
		width:150px;
	}
	.familyimg01, .familyimg02, .familyimg03, .familyimg04{
		height:60px;
	}
	.tail_copyright{
		text-align:center;
		padding-left:0;
	}
}

@media only screen and (max-width:575px){
	.box_area{
		width:350px;
		margin:0 auto;
	}
	.box img{
		width:100%;
	}
	.news_title{
		font-size:0.688rem;
		height:3rem;
	}

	#footer footer{
		padding-top:0px;
	}

	.sub_header{
		height:150px;
	}
	.sub_header p{
		top:50px;
		margin:0 10px 0 10px;
		display:none;
	}
	.head_title{
		top:50%;
		transform:translate(0,-50%);
		text-align:center;
	}
}



@media (min-width: 1200px) {
  .col-lar-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
}
