@charset "UTF-8";
/*
	Author	: hyojeong yang, somi
	Date	: 2018-11
	Project	: 충청북도단양도서관 

	pallete : mainColor ( #333; #754379;  )
			  spotColor { #f15a53; #4e6979; #00b9b0; }
			  graphColor ( #da4657; #17b2cc; #213168; #f9a535; #7d2887; #00b9b0;  )
*/

/* -------------------------------------------------
    BTN
------------------------------------------------- */

/* btn : spot */
.btn.spot,
.btn-sm.spot,
.btn-lg.spot { 
	background:#333;
	border:1px solid #333;
	color:#fff;
}

/* btn : spot2 */
.btn.spot2,
.btn-sm.spot2,
.btn-lg.spot2 { 
	border:1px solid #666;
	background-color:#666;
	color:#fff; 
}

/* btn : spot3 */
.btn.spot3,
.btn-sm.spot3,
.btn-lg.spot3 { 
	color:#fff;
	background-color:#754379;
	border:1px solid #754379;
}

/* btn : spot4 */
.btn.spot4,
.btn-sm.spot4,
.btn-lg.spot4  { 
	color:#555;
	background:#eee;
	border:1px solid #ccc;
}

/* -------------------------------------------------
   SITE-Header
------------------------------------------------- */
.site-header h1 {
    background: url('./images/header/logo.svg') no-repeat;
}
.site-header nav { background:#754379; }
.site-header .util li a strong,
.site-header .site-gnb h2 a,
.site-header .site-gnb ul li a:hover, 
.site-header .site-gnb ul li a:focus { color:#754379; }

/* -------------------------------------------------
   SITE-FOOTER
------------------------------------------------- */

.footer-site .btn-go {
    background:#754379;
    color:#fff;
}

/* -------------------------------------------------
   MAIN
------------------------------------------------- */

/* mn-qmenu */
.mn-qmenu li {
    background:#754379;
}
.mn-qmenu li.spot {
    background:#e5e5e5;
}
.mn-qmenu li.spot strong,
.mn-qmenu li.spot span {
    color:#000;
}
.mn-qmenu li.spot2 {
    background:#dfcfe0;
}
.mn-qmenu li.spot2 strong,
.mn-qmenu li.spot2 span{
    color:#491121;
}
.mn-qmenu li a:after {
     background-image: url('./images/main/qmenu01.svg');
}
.mn-qmenu li:nth-child(2) a:after {
    background-image: url('./images/main/qmenu02.svg');
}
.mn-qmenu li:nth-child(3) a:after {
    background-image: url('./images/main/qmenu03.svg');
}
.mn-qmenu li:nth-child(4) a:after {
    background-image: url('./images/main/qmenu04.svg');
}
.mn-qmenu li:nth-child(5) a:after {
    background-image: url('./images/main/qmenu05.svg');
}
.mn-qmenu li:nth-child(6) a:after {
    background-image: url('./images/main/qmenu06.svg');
}

/* mn-book & service */
.mn-service li a {
    font-size:14px;
    line-height:1.2em;
    padding-top:20px;
}
.mn-service li:nth-child(3) a {
    padding-top:15px;
}
.mn-service li a:before {
    margin:0 auto 5px;
    width: 40px;
    height: 40px;
    background: url('./images/main/service01.svg') center no-repeat;
    background-size:40px;
}
.mn-service li:nth-child(2) a:before {
    background-image: url('./images/main/service02.svg');
}
.mn-service li:nth-child(3) a:before {
    background-image: url('./images/main/service03.svg');
}

/* -------------------------------------------------    
	SUB COMMON
------------------------------------------------- */

/* lnb */
.lnb h2 {
    color: #754379;
}
.lnb h2:before {
    background:#754379;
}
.lnb nav > ul > li.active:not(.current) > a{
    color: #754379;
    background-color: #fff;
}
.lnb nav > ul > li.current > a{
    background-color: #754379;
    color: #fff;
}
.lnb nav > ul > li li a:hover,
.lnb nav > ul > li li a:focus {
    color:#754379;
}
.lnb nav > ul > li li.current a {
    color: #754379;
}

/* -------------------------------------------------    
	SUB EDIT	
------------------------------------------------- */

/* icon_style  */
.icon1		{ background-image: url('./images/basic/bg_icon1.svg'); }

/* 조직도 */
.org_box .org2 > ul > li + li:before {
    left: -50%;
    width: 50%;
    z-index: 0;
}
.org_box .org3 > ul > li > span,
.org_box .org3 > ul > li > a,
.org_box .org3 > ul > li ul {
    max-width:200px;
    margin:0 auto;
}

/* 인사말 */
.greeting_top em {
	color:#754379;
}

/* 연혁 */
.history-cont table th,
.history-summary em  { color:#754379; }

/* -------------------------------------------------    
	- PC MAX-WIDHT 1200 	
------------------------------------------------- */
@media screen and (max-width:1200px) {                                                
}
/* -------------------------------------------------    
	- PC/TABLET MAX-WIDHT 1024	
------------------------------------------------- */
@media screen and (max-width:1024px) {
}

/* -------------------------------------------------    
	- MOBILE MAX-WIDHT 768 	
------------------------------------------------- */
@media screen and (max-width:768px) {

	/* SITE-HEADER */
	.m-site-header h1 {
		background: url('./images/header/logo.svg') no-repeat;		
        background-size: auto 34px;
	}
	.btn-site-nav,
	.m-site-header .site-gnb > li > a > .ui-accordion-header-icon:before, 
	.m-site-header .site-gnb > li > a > .ui-accordion-header-icon:after {
		background:#41669b;
	}
	.m-site-header nav li li a:hover,
    .m-site-header nav li li a:focus {
        color: #41669b;
    }
}

/* -------------------------------------------------    
	- MOBILE MAX-WIDHT 480	
------------------------------------------------- */
@media screen and (max-width:480px) {

	/* SITE-HEADER */
	.m-site-header h1 {  background-size: auto 30px; }

    .org_box .org3 > ul > li > span,
    .org_box .org3 > ul > li > a,
    .org_box .org3 > ul > li ul {
        max-width:none;
        margin:0 10px;
    }
}

/* -------------------------------------------------    
	- MOBILE MAX-WIDHT 375	
------------------------------------------------- */
@media screen and (max-width:375px) {
}
/* -------------------------------------------------    
	- 20240719 
------------------------------------------------- */
.tabs .tab-nav li.active a:focus {
    padding: 10px;
    box-shadow: inset 0 0 0 2px #000000, inset 0 0 0 4px #ffffff; 
}

.tabs .tab-nav li a:focus {
    padding: 10px;
    box-shadow: inset 0 0 0 2px #000000, inset 0 0 0 4px #ffffff; 
}