﻿/*** ver1.00.190603 ***/
/** E5FCC2 9DE0AD e64c49 547980 594F4F  ***/
/*** 모든 패딩 기본 20px, 마진도 20px, bold = font-weight: 600; by blog119 ****/
/*** <link rel="stylesheet" href="/_blog119/bootstrap-3.3.5/css/user.css" /> ****/

/* 한글은 NOTO SANS, 영문은 Montserrat 혼용시  ▷ font-family: 'Noto Sans KR'에 모두 포함됨. [참고] https://feel5ny.github.io/2019/09/08/CSS_02/ */
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 300; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); 
} 
@font-face {
	font-family: 'Noto Sans KR';
	src: url('//fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_cJD3gnD_g.woff2');  /* Montserrat */
	font-weight: 300;
	unicode-range: U+0020-007E;		/* 영문 ONLY*/
	font-style: normal;
}
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 400; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); 
}
@font-face {
	font-family: 'Noto Sans KR';
	src: url('//fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2'); /* Montserrat */
	font-weight: 400;
	unicode-range: U+0020-007E;		/* 영문 ONLY*/
	font-style: normal;
}
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 500; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); 
 }
@font-face {
	font-family: 'Noto Sans KR';
	src: url('//fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gnD_g.woff2'); /* Montserrat */
	font-weight: 500;
	unicode-range: U+0020-007E;		/* 영문 ONLY */
	font-style: normal;
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 700; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); 
 }
@font-face {
	font-family: 'Noto Sans KR';
	src: url('//fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gnD_g.woff2');
	font-weight: 700;
	unicode-range: U+0020-007E;		/* 영문 ONLY*/
	font-style: normal;
}

body{
	font-family: 'Noto Sans KR', sans-serif;
	color: #000;		/**글자가 너무 검은것을 피함 **/
	font-weight: 300;	/* default : regular */
	letter-spacing: 0px;
}
#xet-page {
    font-weight: 400;
    color: #000;    
}

 /*BOARD*/
.boardReadBody .rhymix_content {font-size: 18px !important;}
.xet-mobile-nav li a { font-size: 15px;}

#xet-header > div.xet-acc > a:nth-child(2){display: none;}

@media (min-width: 992px){      /*PC ONLY*/
    /*일반 페이지*/
    body, .xet-nav > li > a, .xet-footer-nav li a {font-size: 18px;}        
    #xet-page {font-size: 18px !important;}

    /*BOARD*/
    #xet_board > div.boardListForm > table, .boardList td .subject{ font-size: 15px; }
    .baord_gallery .itemList .cover_subject a { font-size: 17px;}
}

/*사용자 정의 */
.xet-bijou-list {
  list-style-type: none; /* 기본 불릿 제거 */
  padding-left: 20px;    /* 들여쓰기 조정 (필요 시) */
}

.xet-bijou-list li::before {
  content: "✓ ";         /* 원하는 문자, 이모지로 변경 */
  color: #000;        /* 원하는 색상 지정 */
  margin-left: -15px;    /* 불릿 위치 조정 */
  font-size: 1.1em;      /* 불릿 크기 조정 */
}

.border-b1{border-bottom: 1px solid #bbb;}


/**글자색 <span class="user_color">abc</span> **/
.user_red {color: #F05918;}	
.user_blue {color: #689ad7;} 	/*** 0071bc by blog119 ****/

blockquote {
    padding: 0px 12px;
    margin: 0 0 20px;
    font-size: 120%;
    font-weight: 500;
    border-left: 6px solid #be1e2d;
}
blockquote .small, blockquote footer, blockquote small {
    display: block;
    font-size: 80%;
    font-weight: 300;
    line-height: 1.42857143;
    color: #666;
}
blockquote small:before {
    content: '\2014 \00A0';
}

strong{
	font-weight: 500;
}

/**** 어코디언 판넬
<link href="/_glim/bootstrap-3.3.5/css/w3.css" rel="stylesheet" /> // 페이지 상단
<script src="/_glim/bootstrap-3.3.5/js/accordion.js"></script>  // html 하단 
*******/

.accordion-panel {
    padding: 10px 0;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}
.accordion {
    background-color: #fff;
    color: #147cc1;
    cursor: pointer;
    padding: 20px 20px 10px 0;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 20px;
    transition: 0.4s;
    border-bottom: 1px solid #ddd;
}
.accordion:after {
    content: '\002B';
    color: #777;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}
/*****end of 어코디언 판넬 ******/


/*** 기타 화면 정리용 by blog119 ***/
.clearfix{clear: both;}



/*** 기타 효과 by blog119 **/

img .img-center{
	display: block;
	margin-left: auto;
	margin-right:auto;
}
.img-center{
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.img-border{
	border: 1px solid #ddd;
	padding: 20px;		/*패딩이 있는 상자*/
}
.img-full{
	width: 100%;
}

.line-line-line{
	border-bottom:1px solid #ddd;
	height:5px;
	margin-bottom: 20px;
}
.line-line{	
	border-bottom:3px solid #689ad7;
	height:10px;
	width: 48px;
	margin-bottom: 20px;
}
.line{
	border-bottom: 3px solid #689ad7; 
	height: 10px; 
	width: 20px;
	margin-bottom: 10px;
}

.dotted-line{
	border-bottom:1px dotted #ddd;
	height:5px;
}

/*** 한칸을 꽉체우는 회색상자 by blog119 ****/
.mybox{
	border: 1px solid #eee;
	background: #eee;
	width: 100%;
	padding: 20px;
	margin-bottom: 20px;
}

/*** 버스 일반 등을 나타내는 버튼 by blog119 ****/
.mybutton{
    background-color: #be1e2d;
    border-radius: 9px;
    display: inline-block;
    color: #ffffff;
    padding: 1px 13px;
    text-align: center;
    margin-bottom: 5px;
}

/*** 보라색 LIST by blog119 ****/
.my_list {
	list-style: none;; /* Remove default bullets */
	padding-left: 20px;	
}
.my_list li::before{
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #689ad7; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

/*** hx 재정의 ******************/
h1{
	font-size: 250%;
	font-weight: 300;
}
h1s{
	font-size: 250%;
	font-weight: 500;	
}
h2{
	font-size: 200%;
	font-weight: 300;
}
h2s{
	font-size: 200%;
	font-weight: 500;
}
h3{
	font-size: 170%;
	font-weight: 300;
}
h3s{
	font-size: 170%;
	font-weight: 500;
}
h4{
	font-size: 130%;
	font-weight: 300;
}
h4s{
	font-size: 130%;
	font-weight: 500;
}
h5{
	font-size: 100%;
	font-weight: 500;
}
h5s{
	font-size: 100%;
	font-weight: 500;
}
h5g{
	font-size: 100%;
	font-weight: 500;
	color: #bbb;
}

/*** 이미지 안에 글씨 넣기 by blog119 ****/
.img-container {		/**공통 css **/
	position: relative;
	text-align: center;
}
.img-container .centered-bottom {  /*** 글씨를 하단 중간에 by blog119 ****/
    position: absolute;
    width: 100%;
    bottom: 40px;
}

/*** 이미지 하단 투명 배경 글씨넣기 by blog119 ****/
.container {	
  position: relative;
  margin: 0 auto 10px auto;
  /*** margin-top: 10px; by blog119 ****/
  /*** border: 1px solid #cecece; by blog119 ****/
}
.container img {
	vertical-align: middle;
	border: 1px solid #cecece;
	width: 100%;
}
.container .content {		
		position: absolute;
		bottom: 0;
		background: rgba(0, 0, 0, 0.7); /* Black background with 0.5 opacity */
		color: white;
		width: 100%;
		padding: 20px;
		text-align: center;
}
.container p{		
		position: absolute;
		bottom: 0;
		background: rgb(0, 0, 0); /* Fallback color */
		background: rgba(0, 0, 0, 0.7); /* Black background with 0.5 opacity */
		color: white;
		width: 100%;
		padding: 20px;
		text-align: center;
}

/*** FOR TABLE 사용법 <div class="table-responsive">******************/
.table-responsive {
    min-height: .01%;
    overflow-x: auto;
}

/**사용법 <table class="myTable">**/
.myTable {
    border-collapse: collapse; /* Collapse borders */
    width: 100%; /* Full-width */
    border: 1px solid #d9d9d9; /* Add a grey border */
    font-size: 15px; /* Increase font-size */
    font-family: 'Noto Sans KR', sans-serif;
    margin-bottom: 20px;
}
.myTable th, .myTable td {
    text-align: center; /* center-align text */
    padding: 12px; /* Add padding */
}
.myTable th {
	background-color: #f7f7f9;
}
.myTable tr {
    border-bottom: 1px solid #d9d9d9; 
}

/* stripped table */
.table-striped tr:nth-child(even){background-color: #f7f7f9}

/* bordered table */
.table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border: 1px solid #d9d9d9;    
}

.myTable tr.strong {
    font-weight: 500;
}

.cell-gray{background-color:#f0f0f0;}
.cell-dark-gray{background-color:#838383; color: white;}
.cell-black{background-color:#222222; color: white;}

/*** End of  Table *************/
.col-xs-6,
.col-sm-6,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-lg-3 {margin-bottom: 20px;}

/**** 메인 ****************/
.icon-box {
    text-align: center;
    /*padding: 30px 30px;*/
}
.icon-box:hover {
    background-color: #e7eff1;
}
.icon-box a {
    margin-top: 20px;
    padding: 5px 0px;
    /* background-color: #eee; */
    border: 1px #333 solid;
    /* border-radius: 10px; */
    text-decoration: none;
    color: #333;
    width: 100%;
    display: block;
}
.icon-box a:hover {
    background-color: #497eb2;
    color: white;
}

.icon-box2 a {  /*** 일반 TEXT에서 버튼 표현, xet-btn-default을 안에 쓰면 됨. 예. /gdn/3587 ****/
    padding: 25px 15px;
    border: 1px #333 solid;
    text-decoration: none;
    color: #333;
    width: 100%;
    display: block;
    text-align: center;
}
.icon-box2 a:hover {
    background-color: #689ad7;
    color: white;
}

/*** 반응형 by blog119 ****/
/*** 반응형 by blog119 ****/
@media (max-width: 991px){
	h2k, h2ks, h2e, h2es, h3k, h3ks, h3e, h3es, h4k, h4ks, h4e, h4es {font-size: 110%;}
	h5k, h5ks, h5e, h5es, h6k, h6ks, h6e, h6es {font-size: 100%;}	

	.pc_only{display:none;}
	.m_only{display:block;}

	
	.smart-br{white-space: normal;}  /*** 줄바꿈 X   <span class=""> 형태로 사용 ****/	
	.re-smart-br::after{content: "\A";white-space:pre;} /*** 줄바꿈O  ****/	

	.title_dot{margin-top: 1px;}			/*서클 위치잡기*/
}

@media (min-width: 992px){
	
	.pc_only{display:block;}
	.m_only{display:none;}
	
	.smart-br::after{content: "\A";white-space:pre;} /*** 줄바꿈O  ****/	
	.re-smart-br{white-space: normal;}  /*** 줄바꿈X  ****/	

	.title_dot{margin-top: 4px;}			/*서클 위치잡기*/
}

/**
@media (max-width: 767px){
}
@media (min-width: 768px) and (max-width: 991px){
}
@media (min-width: 992px) and (max-width: 1440px){			
}
@media (min-width: 1441px){
}	

***/