@charset "utf-8";

/*********************************************************************************

	대한종양내과학회  Bootstrap v5.1.3
	Version: 1.0
	Note: This is common css. All common css files import here.

**********************************************************************************/

/* Fonts */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&subset=korean');

/* G마켓 산스 */
@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* Margin, Padding */
.mt100{margin-top:100px !important;}
.mt90{margin-top:90px !important;}
.mt80{margin-top:80px !important;}
.mt70{margin-top:70px !important;}
.mt60{margin-top:60px !important;}
.mt50{margin-top:50px !important;}
.mt40{margin-top:40px !important;}
.mt30{margin-top:30px !important;}
.mt25{margin-top:25px !important;}
.mt20{margin-top:20px !important;}
.mt15{margin-top:15px !important;}
.mt10{margin-top:10px !important;}
.mt05{margin-top:5px !important;}
.mt0{margin-top:0 !important;}

.mr0{margin-right:0px !important;}
.mr5{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr20{margin-right:20px !important;}
.mr30{margin-right:30px !important;}
.mr40{margin-right:40px !important;}
.mr50{margin-right:50px !important;}
.mr60{margin-right:60px !important;}
.mr70{margin-right:70px !important;}
.mr80{margin-right:80px !important;}
.mr90{margin-right:90px !important;}
.mr100{margin-right:100px !important;}

.mb100{margin-bottom:100px !important;}
.mb90{margin-bottom:90px !important;}
.mb80{margin-bottom:80px !important;}
.mb70{margin-bottom:70px !important;}
.mb60{margin-bottom:60px !important;}
.mb50{margin-bottom:50px !important;}
.mb40{margin-bottom:40px !important;}
.mb30{margin-bottom:30px !important;}
.mb20{margin-bottom:20px !important;}
.mb15{margin-bottom:15px !important;}
.mb10{margin-bottom:10px !important;}
.mb5{margin-bottom:5px !important;}
.mb0{margin-bottom:0 !important;}

.ml0{margin-left:0 !important;}
.ml5{margin-left:5px !important;}
.ml10{margin-left:10px !important;}
.ml20{margin-left:20px !important;}
.ml30{margin-left:30px !important;}
.ml40{margin-left:40px !important;}
.ml50{margin-left:50px !important;}
.ml60{margin-left:60px !important;}
.ml70{margin-left:70px !important;}
.ml80{margin-left:80px !important;}
.ml90{margin-left:90px !important;}
.ml100{margin-left:100px !important;}

.m0{margin:0 !important;}
.m5{margin:5px !important;}
.m10{margin:10px !important;}
.m20{margin:20px !important;}
.m30{margin:30px !important;}
.m40{margin:40px !important;}

.pt0{padding-top:0 !important;}
.pt10{padding-top:10px !important;}
.pt20{padding-top:20px !important;}
.pt30{padding-top:30px !important;}
.pt40{padding-top:40px !important;}
.pt50{padding-top:50px !important;}
.pt60{padding-top:60px !important;}
.pt70{padding-top:70px !important;}
.pt80{padding-top:80px !important;}
.pt90{padding-top:90px !important;}
.pt100{padding-top:100px !important;}

.pr0{padding-right:0px !important;}
.pr10{padding-right:10px !important;}
.pr20{padding-right:20px !important;}
.pr30{padding-right:30px !important;}
.pr40{padding-right:40px !important;}
.pr50{padding-right:50px !important;}
.pr60{padding-right:60px !important;}
.pr70{padding-right:70px !important;}
.pr80{padding-right:80px !important;}
.pr90{padding-right:90px !important;}
.pr100{padding-right:100px !important;}

.pb0{padding-bottom:0px !important;}
.pb10{padding-bottom:10px !important;}
.pb20{padding-bottom:20px !important;}
.pb30{padding-bottom:30px !important;}
.pb40{padding-bottom:40px !important;}
.pb50{padding-bottom:50px !important;}
.pb60{padding-bottom:60px !important;}
.pb70{padding-bottom:70px !important;}
.pb80{padding-bottom:80px !important;}
.pb90{padding-bottom:90px !important;}
.pb100{padding-bottom:100px !important;}

.pl0{padding-left:0px !important;}
.pl10{padding-left:10px !important;}
.pl20{padding-left:20px !important;}
.pl30{padding-left:30px !important;}
.pl40{padding-left:40px !important;}
.pl50{padding-left:50px !important;}
.pl60{padding-left:60px !important;}
.pl70{padding-left:70px !important;}
.pl80{padding-left:80px !important;}
.pl90{padding-left:90px !important;}
.pl100{padding-left:100px !important;}

.p0{padding:0px !important;}
.p5{padding:5px !important;}
.p10{padding:10px !important;}
.p20{padding:20px !important;}
.p30{padding:30px !important;}
.p40{padding:40px !important;}


/* Skip */
#skip {position:absolute;top:0;height:0px;width:100%;z-index:2020;}
#skip a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;text-align:center;color:#fff;white-space:nowrap;}
#skip a:focus,
#skip a:active {display:block;top:0;width:100%;height:30px;line-height:30px;background:#1c7915;}

/* skip ----------------------------------------------*/
#accessibility {position:absolute; top:0; left:0; width:100%; z-index:9999;}
#accessibility a {font-size:14px; position:absolute; top:-9999px;}
#accessibility a:hover, #accessibility a:active, #accessibility a:focus {display:inline-block; top:0; width:100%; padding:10px 0; color:white; font-weight:bold; text-align:center; background-color:black;}

/* 숨김(처리) */
.blind {position:absolute;left:-9999px;width:0;height:0;overflow:hidden;font-size:0;line-height:0;z-index:-1;}
.hide {position:absolute;left:-9999px;width:0;height:0;overflow:hidden;font-size:0;line-height:0;z-index:-1;}
.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0,0,0,0);border: 0;}
/* 익스 부트스트랩 인식 버그*/
.visually-hidden {position: absolute!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: !important;}

/* 정렬 */
.fr {float:right;}
.fl {float:left;}
.clear {clear:both;}

.relative {position:relative;}

/* 텍스트정렬 */
.tac {text-align:center !important;}
.tal {text-align:left !important;}
.tar {text-align:right !important;}

input::placeholder {font-size:0.93rem; color:#999; font-weight:300;}
input::-webkit-input-placeholder {font-size:0.93rem; color:#999; font-weight:300;}
input:-ms-input-placeholder {font-size:0.93rem; color:#999; font-weight:300;}
select::-ms-expand { display: none; }

textarea::placeholder {font-size:0.93rem; color:#999; font-weight:300;}
textarea::-webkit-input-placeholder {font-size:0.93rem; color:#999; font-weight:300;}
textarea:-ms-input-placeholder {font-size:0.93rem; color:#999; font-weight:300;}

/* clearfix */
.clearfix {*zoom:1;}
.clearfix:before, .clearfix:after {display:block; content: ''; line-height: 0;}
.clearfix:after {clear: both;}

/* 글자 색상들 */
.green {color:#5d8e44 !important;}
.red {color:#c00000 !important;}
.orange {color:#ff661b !important;}

.fbold {font-weight:700;}
.fbold2 {font-weight:500;}

/* 가로 크기 */
.width_8 {width:8%;}
.width_10 {width:10%;}
.width_12 {width:12%;}
.width_15 {width:15%;}
.width_25 {width:25%;}
.width_30 {width:30%;}
.width_35 {width:35%;}
.width_48 {width:48%;}
.width_50 {width:50%;}
.width_75 {width:75%;}
.width_100 {width:100%;}


.m-show {display: none !important;}
.cf:after{display: block;content: '';clear: both;}

/* 링크 disable */
.disable-Link {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    opacity: 0.5;
}

/* tablet */
@media only screen and (max-width : 1230px){
	
	.mb-lg-70 {margin-bottom:70px!important;}
	
}
/* mobile */
@media only screen and (max-width : 992px){

    input::placeholder {font-size:16px;}

	.m-hide {display:none !important;}
}
@media only screen and (max-width : 767px){

    input::placeholder {font-size:15px;}
	
	.mb-md-60 {margin-bottom:60px!important;}
	.mb-md-50 {margin-bottom:50px!important;}
	.mb-md-30 {margin-bottom:30px!important;}

	.m-show {display: block !important;}

}
@media only screen and (max-width : 486px){



}

[v-cloak] { display: none; }
div .inline-block {
    display: inline-block;
}

.text-ellipsis {
    width: 70px;
    padding: 0 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 이미지 세팅 */
.thumbnail-wrap {display: inline-block;/*border: 1px solid #000;*/ }
.thumbnail {position: relative; padding-top: 56.25%; /* 16:9 */  overflow: hidden;}
.thumbnail img {position: absolute; top:0; left: 0; z-index:5;}

/*
2:1 : padding-top: 50%
1:2 : padding-top: 200%
4:3 : padding-top: 75%
16:9 : padding-top: 56.25%
*/

.thumbnail .centered  {position: absolute;  top: 0; left: 0;  right: 0;  bottom: 0; z-index:5;
    -webkit-transform: translate(50%,50%);
    -ms-transform: translate(50%,50%);
    transform: translate(50%,50%);}
.thumbnail .centered img {
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);}

.thumbnail img.portrait {width:100%;max-width:none;height:auto;}
.thumbnail img.landscape {width:auto;max-width:none;height:100%;}


/* 플렉스 설정-가로 균등*/
.flex-container {
    /* flex */
    -webkit-appearance:none;
    /* 플렉스 컨테이너 생성 */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    /* 플렉스 감싸기(줄바꿈) 금지 설정 */
    -webkit-box-lines: single;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;

    /* 플렉스 주축 row 설정*/
    -webkit-box-orient: horizontal;
    -ms-flex-direction: row;
    flex-direction: row;

    /* 플렉스 아이템 교차축 baseline 정렬*/
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
}
.flex-container .flex-item {-webkit-appearance:none;
    /* 플렉스 확장 지수 설정*/
    -webkit-box-flex: 1;
    -ms-flex: 1;
}
.flex-containe .grow1 {flex-grow: 1;}
.flex-container .auto {flex: auto; /* flex: 1 1 auto; */}