/* 울진군의료원 소개 */
.intro_wrap .logo_box{display: flex; gap:30px; align-items: center;}
.intro_wrap .logo_box dt{padding:45px; text-align:center; border:1px solid #ddd; border-radius:20px;}
.intro_wrap .logo_box dt img{max-width:100%; vertical-align: top;}
.intro_wrap .logo_box dd {flex:1; line-height: 2;}


/* 미션 및 비전 */
.mission_box{text-align:center;}
.mission_box .title{position: relative; display: inline-block; padding:0 80px; line-height: 1.8; text-align:left; font-size:4rem; font-weight: 200;}
.mission_box .title::before, .mission_box .title::after{content: ""; position: absolute; width:46px; height:40px; background-repeat: no-repeat; background-size: 100%;}
.mission_box .title::before{left:0; top:0; background-image: url(/nanum/site/builder/dir/main/img/menu6025/mission_title_bg01.png);}
.mission_box .title::after{right:0; bottom:20px; background-image: url(/nanum/site/builder/dir/main/img/menu6025/mission_title_bg02.png);}
.mission_box .title span{display: inline-block; margin-right:10px; color:#666;}
.mission_box .title .gap{margin-left:130px;}

.mission_box dl.mis_dot{margin:50px 0; padding:40px; border:1px dashed #777; border-radius:20px;}
.mission_box dl.mis_dot dt{position: relative; padding-bottom:40px; margin-bottom: 10px; font-size:3.5rem; font-family: 'RIDIBatang'; color:#cacaca;}
.mission_box dl.mis_dot dt::before{content: ""; position: absolute; left:50%; bottom:0; width:1px; height: 20px; background: #000; transform: translateY(-50%);}
.mission_box dl.mis_dot dd{line-height: 1.4; font-size:3.5rem; font-weight: 400;}


/* 원장인사말 */
.intro_wrap .introduce_tit{position: relative; display:flex; gap:30px 80px;}

.intro_wrap .introduce_tit .img{display: flex; justify-content:flex-end; align-items: flex-end; width:calc(45% - 15px); overflow: hidden;}
.intro_wrap .introduce_tit .img::before{content:""; position:absolute; left:0; top:0; width:100%; height:100%; background: url("/nanum/site/builder/dir/main/img/menu6025/introduce_bg.jpg"); background-size: cover;}
.intro_wrap .introduce_tit .img::after{content: ""; position: absolute; left:0; bottom:0; width:254px; height: 336px; background-image: url(/nanum/site/builder/dir/main/img/menu6025/doctor_img.png); background-position: left bottom; background-size: 100%; background-repeat: no-repeat;}
.intro_wrap .introduce_tit .img .name{position: relative; margin-right: 20px; padding:14px 45px 14px 0; line-height: 1.4; color:#fff; font-size:1.7rem; font-weight: 700; border-radius: 0 20px 0 0; background: #4362c9; box-shadow: 0 0 15px rgba(67,98,201,0.7); z-index:1;}
.intro_wrap .introduce_tit .img .name::before{content: ""; position: absolute; left:-80px; top:0; width:80px; height: 80px; border-top:40px solid transparent; border-right:40px solid #4362c9; border-bottom:40px solid #4362c9; border-left:40px solid transparent; box-sizing: border-box;}
.intro_wrap .introduce_tit .img .name::after{content: ""; position: absolute; right: 20px; bottom: 10px; width:2px; height: 15%; background:#fff; transform: rotate(45deg);}
.intro_wrap .introduce_tit .img .name .name_txt{position: relative;}
.intro_wrap .introduce_tit .img .name .name_txt::before, 
.intro_wrap .introduce_tit .img .name .name_txt::after{content: ""; position: absolute; left:-55px; bottom:-46px; width:2px; height: 250%; background: #4362c9; transform: rotate(45deg);}
.intro_wrap .introduce_tit .img .name .name_txt::after{left:-63px;}
.intro_wrap .introduce_tit .img .name .name_txt span{display:block; font-size:2rem; font-weight: 500;}

.intro_wrap .introduce_tit .txt{position: relative; width:calc(50% - 15px); padding:40px 0;}
.intro_wrap .introduce_tit .txt .tit{position: relative; margin-bottom:55px; line-height: 1.4; font-size:3.2rem;}
.intro_wrap .introduce_tit .txt .tit::before,
.intro_wrap .introduce_tit .txt .tit::after{content: ""; position: absolute; top: 0; right: 80px; width:28px; height: 10px; background:#4362c9;}
.intro_wrap .introduce_tit .txt .tit::after{width:10px; height: 28px; background:#132e8a;}

.intro_wrap .introduce_txt{display: flex;  flex-wrap: wrap; justify-content: space-between; gap: 30px; margin-top:55px;}
.intro_wrap .introduce_txt .txt{width:calc(50% - 15px);}

.intro_wrap .introduce_txt .txt .right_txt{text-align: right;}
.intro_wrap .introduce_txt .txt .right_txt span{position: relative; display:inline-block; padding:0 25px; font-size:2rem; font-weight: 700;}
.intro_wrap .introduce_txt .txt .right_txt span::before,
.intro_wrap .introduce_txt .txt .right_txt span::after{content: ""; position: absolute; left:0; top:50%; width:10px; height: 1px; background:#000; transform: translateY(-50%);}
.intro_wrap .introduce_txt .txt .right_txt span::after{left:auto; right:0;}

/* 주요연혁 */
.intro_wrap .history{text-align:center;}
.intro_wrap .history .history_tab{display:inline-flex; margin-bottom:80px; padding:15px; background:#f3f3f3; border-radius:50px;}
.intro_wrap .history .history_tab > li{padding:10px 20px; color:#666; transition: .3s; border-radius:50px;}
.intro_wrap .history .history_tab > li.on{color:#000; background:#fff; box-shadow: 2px 2px 5px rgba(0,0,0,0.1);}

.intro_wrap .history .history_list{display:flex; align-items:flex-start; justify-content: space-between; text-align:left;}
.intro_wrap .history > div.history_list:nth-child(n+2){margin-top:100px;}
.intro_wrap .history .history_list .year{width:40%; line-height: 1; font-family: 'GmarketSans'; font-size:8rem; font-weight: 700; letter-spacing: -0.050em;}
.intro_wrap .history .history_list .day_box{position: relative; width:50%; margin-top:20px; padding-left:35px; box-sizing:border-box; box-sizing:border-box;}
.intro_wrap .history .history_list .day_box::before{content: ""; position: absolute; left:0; top:10px; width:1px; height:100%; background:#000;}
.intro_wrap .history .history_list .day_box > dl > dt{position: relative; margin-bottom:25px; line-height: 1; font-size:3rem; font-weight: 900;}
.intro_wrap .history .history_list .day_box > dl > dt::before{content: ""; position: absolute; left:-44px; top: 50%; width:20px; height: 20px; border:4px solid #4362c9; border-radius:50%; background:#fff; transform: translateY(-50%); box-sizing: border-box;}
.intro_wrap .history .history_list .day_box > dl:nth-child(n+2) > dt{margin-top:35px;}
.intro_wrap .history .history_list .day_box > dl > dd > ul > li{display: flex; padding:25px 20px; gap:20px; border-radius:15px; box-shadow: 1px 1px 8px rgba(0,0,0,0.1);}
.intro_wrap .history .history_list .day_box > dl > dd > ul > li:nth-child(n+2){margin-top:15px;}
.intro_wrap .history .history_list .day_box > dl > dd > ul > li p.day{width:55px; font-weight: 700;}

/* 주요 전화번호 */
.intro_wrap .number_box{padding:50px; background-color:#f5f5f5; border-radius:35px;}
.intro_wrap .number_box dl{display:flex; gap:60px;}
.intro_wrap .number_box dl > dt{position:relative; align-self:center; width:270px; min-height:483px; text-align:center; border-radius:45px; background-image: url("/nanum/site/builder/dir/main/img/menu6025/phone_img.png"); background-size: 100% auto; background-repeat:no-repeat; box-shadow:0 0 25px rgba(0,0,0,0.25);}
.intro_wrap .number_box dl > dt .call_number > li{opacity:0; position: absolute; left:50%; top:80px; width:100%; transform:translateX(-50%); transition:.5s;}
.intro_wrap .number_box dl > dt .call_number > li .tit{font-weight:700;}
.intro_wrap .number_box dl > dt .call_number > li .number{font-weight:700; font-size:2.8rem; color:#4362c9;}

.intro_wrap .number_box dl > dt .call_number > li.on{opacity: 1;}

.intro_wrap .number_box dl > dd{width:calc(100% - 330px); text-align:center;}
.intro_wrap .number_box dl > dd .call_number{display:flex; gap:20px; flex-wrap:wrap;}
.intro_wrap .number_box dl > dd .call_number > li{position:relative; display:flex; align-items:center; justify-content:center; flex-direction:column; width:calc(33.333% - 13.4px); padding:20px 0; border-radius:20px; box-sizing:border-box; background-color:#fff;}
.intro_wrap .number_box dl > dd .call_number > li::before{content:""; display:block; width:66px; height:66px; background-repeat: no-reepeat; background-size: 100% auto;}
.intro_wrap .number_box dl > dd .call_number > li::after{content:""; display:none; position: absolute; left:0; top:0; width:100%; height: 100%; border:2px solid #4362c9; box-shadow:0 0 25px rgba(67, 98, 201,0.3); border-radius:20px;}
.intro_wrap .number_box dl > dd .call_number > li.call_icon01::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon01.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon02::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon02.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon03::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon03.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon04::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon04.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon05::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon05.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon06::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon06.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon07::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon07.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon08::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon08.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon09::before{background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon09.png);}

.intro_wrap .number_box dl > dd .call_number > li .number{font-size:1.5rem; color:#4362c9;}

.intro_wrap .number_box dl > dd .call_number > li.call_icon_logo{flex-direction:row; justify-content:space-between; width:100%; padding:20px; text-align:left;}
.intro_wrap .number_box dl > dd .call_number > li.call_icon_logo::before{width:55px; height:55px; background-image: url(/nanum/site/builder/dir/main/img/menu6025/number_icon_logo.png);}
.intro_wrap .number_box dl > dd .call_number > li.call_icon_logo .tit, 
.intro_wrap .number_box dl > dd .call_number > li.call_icon_logo .number{font-size:2rem; font-weight:700;}

.intro_wrap .number_box dl > dd .call_number > li:hover::after{display:block;}



/* 안전보건경영방침 */
.safety{position: relative; text-align:center; border:4px solid #ecc971; background-image: url(/nanum/site/builder/dir/main/img/menu6025/safety_bg_logo.png); background-position: center; background-repeat:no-repeat; backdrop-filter: 0.2;}
.safety .safety_box{position: relative; padding:100px 0; }
.safety::before,
.safety::after,
.safety .safety_box::before,
.safety .safety_box::after{content: ""; position: absolute; left: -4px; top:-4px; width:93px; height: 93px; background-image: url(/nanum/site/builder/dir/main/img/menu6025/safety_bg_border.png); background-position: top left; background-repeat: no-repeat; background-color: #fff;}
.safety::after{left:auto; right:-4px; transform: rotate(90deg);}
.safety .safety_box::before{top:auto; bottom:-4px; transform: rotate(270deg);}
.safety .safety_box::after{left:auto; right:-4px; top:auto; bottom:-4px; transform: rotate(180deg);}

.safety .safety_box .safety_tit{font-size:5rem; font-weight: 700;}
.safety .safety_box .mid_txt{margin-top:50px; padding:0 190px; font-size: 3rem;}
.safety .safety_box .safety_num{margin-top:80px; padding:0 140px 0 160px; text-align: left;}
.safety .safety_box .safety_num > li{list-style: decimal; font-size:2.5rem;}
.safety .safety_box .safety_num > li:nth-child(n+2){margin-top:40px;}

.safety .safety_box .day_txt{margin-top:100px; font-size:2.5rem;}
.safety .safety_box .name{margin-top:50px; font-size: 2.5rem; font-weight: 700;}
.safety .safety_box .name .name_sain{display: inline-block; margin-left:20px; padding:10px 165px 10px 0; background-image: url(/nanum/site/builder/dir/main/img/menu6025/safety_sain.png); background-position: center right; background-repeat: no-repeat;}



/* 층별안내 */
.floor_wrap .floor_mainimg img{vertical-align: top; max-width:100%;}
.floor_wrap .floor_srch{margin-bottom:50px; padding:30px; background-color:#f9fafc;}
.floor_wrap .floor_srch .srch_box{display:flex; justify-content:center;}
.floor_wrap .floor_srch .srch_box .srch_txt{min-width:350px; height:45px; padding:0 10px; border:1px solid #e5e5e5; font-size:1.5rem; font-weight:500; box-sizing:border-box;}
.floor_wrap .floor_srch .srch_box .btn_srch{padding:0 20px; font-size:1.5rem; font-weight:500; color:#fff; border:0; background-color:#000; cursor: pointer;}

/*층별 탭*/
.floor_wrap .floor_tab{margin-bottom:30px;}
.floor_wrap .floor_tab ul{display:flex; flex-wrap:wrap;}
.floor_wrap .floor_tab ul > li{flex:1;}
.floor_wrap .floor_tab ul > li a{display:block; padding:15px 0; text-align:center; font-size:2.3rem; font-weight:700; color:#999999; border-bottom:1px solid #ccc; box-sizing: border-box;}
.floor_wrap .floor_tab ul > li.on a{color:#000; border-bottom:3px solid #000;}

.floor_wrap .floor_list{margin-bottom:50px; padding:20px; border:1px solid #ddd;}
.floor_wrap .floor_list ul{display:flex; flex-wrap:wrap; gap:10px 30px;}
.floor_wrap .floor_list ul > li{font-size:1.5rem;}
.floor_wrap .floor_list ul > li.on{color:#4d61c7; font-weight:700;}

/*층별 위치*/
.floor_wrap .floor_cont{position: relative;}
.floor_wrap .floor_cont .floor_img img{max-width:100%; vertical-align: top;}
.floor_wrap .floor_cont .map_pin{position: absolute; top:50%; left:50%; min-width:30px; min-height:45px; padding-bottom:10px; transform:translate(-50%, -50%);}
.floor_wrap .floor_cont .map_pin::before, .floor_wrap .floor_cont .map_pin::after{content:""; position: absolute;}
.floor_wrap .floor_cont .map_pin::before{bottom:0; left:0; width:100%; height:10px; border-radius:100%; background:rgba(0,0,0,0.2);}
.floor_wrap .floor_cont .map_pin::after{
	top:0; 
	left:0; 
	width:100%; 
	height:100%; 
	background-image:url(/nanum/site/builder/dir/main/img/menu6025/map_pin.png); 
	background-size: 100% auto; 
	background-repeat: no-repeat;
	animation-name:map_pin;
	animation-fill-mode:forwards;
	animation-iteration-count:infinite;
	animation-duration:1.3s;
}

@keyframes map_pin{
	0%{top:-3px;}
	20%{top:-10px;}
	40%{top:3px;}
	60%{top:-7px;}
	80%{top:0px;}
	100%{top:-3px;}
}



/********************태블릿********************/
@media all and (max-width:1024px){


	/* 미션 및 비전 */
	.mission_box dl.mis_dot{margin:5vw 0; padding:4vw;}


	/* 원장인사말 */
	.intro_wrap .introduce_tit .txt .tit{margin-bottom:25px;}
	
	/* 주요연혁 */
	.intro_wrap .history .history_list{flex-direction:column;}
	.intro_wrap .history .history_list .year{width:100%;}
	.intro_wrap .history .history_list .day_box{width:100%;}
	
	
	/* 주요전화번호 */
	.intro_wrap .number_box dl{flex-direction:column; gap:30px;}
	.intro_wrap .number_box dl > dd{width:100%;}
	
	/*층별안내*/
	.floor_wrap .floor_cont .map_pin{min-width:20px; min-height:30px;}
	
	/* 안전보건경영방침 */
	.safety .safety_box .mid_txt{padding:0 10vw;}
	.safety .safety_box .safety_num{padding:0 12vw 0 10vw;}
	
	
}

/********************모바일********************/
@media all and (max-width:767px){


	/* 울진군의료원 소개 */
	.intro_wrap .logo_box{flex-direction:column;}
	.intro_wrap .logo_box dt{padding:3.5vh;}
	
	.intro_wrap .logo_box dt img{max-width:70%;}
	
	/* 미션 및 비전 */
	.mission_box .title{padding:0 8vw; line-height: 1.6; font-size:2.5rem;}
	.mission_box .title .gap{margin-left:10vw;}
	.mission_box .title::before, .mission_box .title::after{width:26px; height:20px;}
	
	.mission_box dl.mis_dot dt{padding-bottom:25px; margin-bottom:5px; font-size:3rem;}
	.mission_box dl.mis_dot dt::before{height:15px;}
	.mission_box dl.mis_dot dd{font-size:2.5rem;}
	
	/* 원장인사말 */
	.intro_wrap .introduce_txt{flex-direction:column;}
	.intro_wrap .introduce_txt .txt{width:100%;}

	.intro_wrap .introduce_tit{gap:20px;}
	.intro_wrap .introduce_tit .img{width:40%;}
	.intro_wrap .introduce_tit .img::after{width:200px; height:282px;}
	.intro_wrap .introduce_tit .img .name{margin-right:15px;}
	
	.intro_wrap .introduce_tit .txt{width:55%;}
	
	/* 주요연혁 */
	.intro_wrap .history .history_tab{flex-wrap:wrap; width:100%; margin-bottom:8vh; border-radius:20px; box-sizing:border-box;}
	.intro_wrap .history .history_tab > li{width:calc(50% - 40px); padding:1.5vh 20px;}
	
	.intro_wrap .history > div.history_list:nth-child(n+2){margin-top:16vw;}
	.intro_wrap .history .history_list .year{font-size:6rem;}
	.intro_wrap .history .history_list .day_box{padding-left:30px;}
	.intro_wrap .history .history_list .day_box::before{left:7px;}
	.intro_wrap .history .history_list .day_box > dl > dt{margin-bottom:15px;}
	.intro_wrap .history .history_list .day_box > dl > dt::before{left:-30px; width:15px; height:15px; border:3px solid #4362c9;}
	.intro_wrap .history .history_list .day_box > dl > dd > ul > li{gap:10px; padding:2.5vh 2vh; box-shadow:1px 1px 4px rgba(0,0,0,0.1);}
	.intro_wrap .history .history_list .day_box > dl > dd > ul > li:nth-child(n+2){margin-top:10px;}
	.intro_wrap .history .history_list .day_box > dl > dd > ul > li p.day{width:45px;}
	
	/* 주요전화번호 */
	.intro_wrap .number_box{padding:3vh;}
	.intro_wrap .number_box dl > dt{width:230px; min-height:413px; border-radius:35px;}
	.intro_wrap .number_box dl > dd .call_number{gap:10px;}
	.intro_wrap .number_box dl > dt .call_number > li{top:60px;}
	.intro_wrap .number_box dl > dt .call_number > li .tit{font-size:2rem; font-weight:700;}
	.intro_wrap .number_box dl > dt .call_number > li .number{font-size:3.2rem;}
	
	.intro_wrap .number_box dl > dd .call_number > li{width:calc(50% - 7px);}
	.intro_wrap .number_box dl > dd .call_number > li.call_icon_logo{flex-direction:column; gap:5px;}
	.intro_wrap .number_box dl > dd .call_number > li .number{font-size:2rem;}
	
	
	/* 층별안내 */
	.floor_wrap .floor_srch{margin-bottom:20px;}
	
	
	/* 경영공시 */
	.intro_wrap .md_box{padding:35px 20px 35px 140px; background-size:100px auto; background-position: left 20px center;}

	
	/* 안전보건경영방침 */
	.safety{background-size: 35%; border:3px solid #ecc971;}
	.safety::before, .safety::after, .safety .safety_box::before, .safety .safety_box::after{left:-3px; top:-3px; width:63px; height:63px; background-size:cover;}
	.safety::after{right:-3px; left:auto;}
	.safety .safety_box{padding:10vh 0;}
	.safety .safety_box::before{top:auto; bottom:-3px;}
	.safety .safety_box::after{left:auto; top:auto; right:-3px; bottom:-3px;}
	
	.safety .safety_box .safety_tit{font-size:3rem;}
	
	.safety .safety_box .mid_txt{margin-top:5vw; padding:0 5vw; font-size:2rem;}
	
	.safety .safety_box .safety_num{margin-top:8vw; padding:0 8vw;}
	.safety .safety_box .safety_num > li{font-size:1.7rem;}
	.safety .safety_box .safety_num > li:nth-child(n+2){margin-top:4vw;}

	.safety .safety_box .day_txt{margin-top:10vw; font-size:2rem;}
	.safety .safety_box .name{margin-top:5vw; font-size:2rem;}
	.safety .safety_box .name .name_sain{margin-left:10px; padding:10px 90px 10px 0; background-size: 110px auto;}
	
}


/********************모바일********************/
@media all and (max-width:640px){

	
	/* 원장인사말 */
	.intro_wrap .introduce_tit{flex-direction:column;}
	.intro_wrap .introduce_tit .img{position:relative; justify-content:normal; width:100%; height:300px;}
	.intro_wrap .introduce_tit .img::after{width:204px; height:286px;}
	.intro_wrap .introduce_tit .img .name{margin-right:0; margin-left:180px; padding:14px 30px 14px 0;}
	.intro_wrap .introduce_tit .img .name .name_txt::before, .intro_wrap .introduce_tit .img .name .name_txt::after{left:-47px; bottom:-34px;}
	.intro_wrap .introduce_tit .img .name .name_txt::after{left:-55px;}
	
	.intro_wrap .introduce_tit .txt{width:100%; padding:0;}
	.intro_wrap .introduce_tit .txt .tit{margin-bottom:30px; font-size:3rem;}
	.intro_wrap .introduce_tit .txt .tit::before, .intro_wrap .introduce_tit .txt .tit::after{right:0; width:20px; height:8px;}
	.intro_wrap .introduce_tit .txt .tit::after{width:8px; height:20px;}
	
	.intro_wrap .introduce_txt{margin-top:5.5vw;}
	
}



/********************모바일********************/
@media all and (max-width:480px){


	/* 울진군의료원 소개 */
	.intro_wrap .logo_box{flex-direction:column;}
	
	/* 경영공시 */
	.intro_wrap .md_box{padding:150px 20px 30px 20px; text-align:center; background-position: center top 35px;}
	
	/* 주요전화번호 */
	.intro_wrap .number_box dl > dd .call_number > li{width:100%;}
	
	/* 찾아오시는 길 */
	.intro_wrap .map_info > ul > li:nth-child(n+2){width:100%;}

	/* 층별안내 검색 */
	.floor_wrap .floor_srch .srch_box .srch_txt{min-width:auto;}

}

/********************웹********************/
@media all and (min-width:1025px) {

.intro_wrap .history .history_tab > li:hover{color:#000; background: #fff; box-shadow: 2px 2px 5px rgba(0,0,0,0.1);}


}