@charset "utf-8";

.sub {width: auto; min-height: calc(100vh - 454px); padding: 48px 0 0}

/******************************
	SUB-VISUAL	SUB-VISUAL
******************************/
#sub-visual {height: 240px; position: relative; z-index: 1; overflow: hidden; margin: 0}
#sub-visual .title-box {color: #fff; display: flex; flex-direction: column; align-items: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10}
#sub-visual .title-box strong {font-size: 48px; font-weight: 100}
#sub-visual .title-box span {margin: 24px 0 0}
#sub-visual .sub-visual-img {height: 100%;position: relative;overflow: hidden;z-index: 1;background: url(/img/lms/sub/img-sub-visual-smart.png) no-repeat center; background-size: cover}

/******************************
	SUB-NAV	SUB-NAV	SUB-NAV
******************************/
.sub-nav {height: 64px; clear: both; background: #fff; border-bottom: 1px solid var(--line-gray); position: relative; z-index: 20}
.sub-nav .btn-home {width: 64px; height: 64px; background: var(--navy) url('/img/lms/com/icon-home.svg') 50% 50% no-repeat; background-size: 32px; font-size: 0; display: block; float: left}

/******************************
	SUB-TAB	SUB-TAB	SUB-TAB
******************************/
ul.sub-tab {width: 100%; display: flex; margin: 0 0 48px}
ul.sub-tab li {width: 100%; height: 80px; font-size: 20px; color: #646464; border-bottom: 1px solid var(--navy); display: flex; align-items: center; justify-content: center; position: relative; cursor: pointer; border-radius: 20px 20px 0 0}
ul.sub-tab.down-size li {width: 100%; height: 60px; font-size: 16px; color: #646464; border-bottom: 1px solid var(--navy); display: flex; align-items: center; justify-content: center; position: relative; cursor: pointer; border-radius: 20px 20px 0 0}
ul.sub-tab li::after {width: 1px; height: 24px; background-color: #e3e5e6; content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%)}
ul.sub-tab li:last-child::after {content: none}
ul.sub-tab li.on {font-weight: 500; color: var(--navy); border: 1px solid var(--navy); border-width: 1px 1px 0}

/******************************
		CONTENT	TEXT
******************************/
.sub-title-box {width: 100%; display: flex; align-items: center; justify-content: space-between; margin: 0 0 28px}
.sub-title-box.btm-line {border-bottom: 1px solid var(--line-gray); padding: 0 0 20px}
.logo_box{border:1px solid #ebebeb;margin-top:30px;background:#fff;font-size:0}
.logo_box div{font-size:0;padding:20px}
.logo_box div img{max-height:60px}
.logo_box .noLogo{padding:0px 40px;display:block;font-size:30px;line-height:100px;color:#fff;background:#103876;font-family: 'Paperlogy-8ExtraBold';min-width:300px;text-align:center}

.cont-block {}
.cont-block+.cont-block {margin-top: 48px}
.text-box p {line-height: 24px; color: var(--gray)}
.h2 {font-size: 24px; letter-spacing: -.1em; position: relative; padding: 0 0 0 24px}
.h2::before {width: 16px; height: 16px; background-color: #fff; border: 4px solid var(--navy); border-radius: 50%; content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%)}
.h3 {color: var(--navy)}
.h4 {color: var(--black)}
p.text {line-height: 30px; color: var(--gray)}
p.bg {position: relative; padding-left: 15px}
p.bg::before {width: 8px; height: 1px; background: var(--line-gray2); content: ''; position: absolute; top: 13px; left: 0}
p.right-comment {text-align: right; display: block}
@media screen and (max-width: 600px) {
.logo_box .noLogo{font-size:20px;word-break:keep-all}
	}


/******************************
	사업소개	사업소개	사업소개
******************************/
.s0101 {width: 1000px; margin: 0 auto}
.s0101-img-pc {width: 100%; display: block}
.s0101-img-m {display: none}



/******************************
	강좌상세	강좌상세	강좌상세
******************************/
/* 강좌상세 상단 정보 */
.lecture-view-top {width: 100%; display: flex; justify-content: space-between; margin: 0 0 48px}
.lecture-view-top .lec-thumb {width: 900px; height: auto; position: relative; overflow: hidden}
.lecture-view-top .lec-thumb img {width: 100%; max-width: none; font-size: 0; border-radius: 0 40px 0 40px; display: inline-block; position: absolute; top: 0; left: 0; z-index: 10; padding-top: 0 !important; overflow: hidden}
.lecture-view-top .lec-thumb .basic-img {width: 100%; background: #f4f4f4; border-radius: 0 40px 0 40px; position: absolute; padding-top: calc(100% * 0.54); overflow: hidden}
.lecture-view-top .lec-thumb .basic-img::after {width: 100%; height: 100%; background: url('/img/lms/com/logo.svg') 50% 50% no-repeat; background-size: 65%; opacity: .4; position: absolute; top: 0; left: 0;  content: ''}
.lecture-view-top .lec-info {width: calc(100% - 948px); display: flex; flex-direction: column;}
.lecture-view-top .lec-info .state {width: 100%; height: 48px; font-size: 20px; border-width: 1px; border-style: solid; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin: 0 0 20px}
.lecture-view-top .lec-info .state.state1 {font-weight: 500; color: var(--navy); border-color: var(--navy)}
.lecture-view-top .lec-info .state.state2 {color: var(--gray); border-color: var(--line-gray2)}
.lecture-view-top .lec-info strong.lec-title {font-size: 32px; line-height: 1.2; letter-spacing: -.1em; display: block; margin: 0 0 24px}
.lecture-view-top .lec-info strong.lec-title span.category {font-size: 24px; font-weight: 500; color: var(--navy); display: block; margin: 0 0 8px}
.lecture-view-top .lec-info ul.info-list {width: 100%; border-width: 1px 0; border-style: solid; border-color: var(--line-gray); padding: 16px 0; margin: 0 0 16px}
.lecture-view-top .lec-info ul.info-list li {width: 100%; color: var(--gray); display: flex; align-items: center; margin: 0 0 20px}
.lecture-view-top .lec-info ul.info-list li:last-child {margin: 0}
.lecture-view-top .lec-info ul.info-list li .title {width: 120px; font-weight: 500}
.lecture-view-top .lec-info ul.info-list li .info {width: calc(100% - 120px)}
.lecture-view-top .lec-info ul.info-list li .info.edu-date {line-height: 1.4}
.lecture-view-top .lec-info ul.info-list li .info.type-box {display: flex}
.lecture-view-top .lec-info ul.info-list li .info.type-box .type {width: 80px; height: 30px; font-size: 14px; font-weight: 500; background-color: #fff; border-radius: 15px; display: flex; align-items: center; justify-content: center}
.lecture-view-top .lec-info ul.info-list li .info.type-box .type.type1 {color: #3d5d43;border: 1px solid #3d5d43;}
.lecture-view-top .lec-info ul.info-list li .info.type-box .type.type2 {color: #954b4b;border: 1px solid #954b4b; margin: 0 0 0 4px}
.lecture-view-top .lec-info .info-button-box1 {width: 100%; border-bottom: 1px solid var(--line-gray); padding: 0 0 16px; margin: 0 0 16px}
.lecture-view-top .lec-info .info-button-box1 button {font-size: 14px}
.lecture-view-top .lec-info .info-button-box1 button.inactive {opacity: .4; cursor: default}
.lecture-view-top .lec-info .info-button-box2 {width: 100%}
.lecture-view-top .lec-info .info-button-box2 button {width: calc(50% - 8px); height: 48px}
.lecture-view-top .lec-info .info-button-box3 {margin: 16px 0 0}
.lecture-view-top .lec-info .info-button-box3 button {width: 100%; height: 48px}
/* 강좌상세 탭 컨텐츠 */
.lecture-view-cont-area {position: relative}
/* 강좌상세 - 온라인 학습목록 */
.lec-online-list {width: 100%; display: flex; flex-direction: column}
.lec-online-list li {width: 100%; height: 80px; font-size: 20px; border-bottom: 1px solid var(--line-gray); display: flex; align-items: center; justify-content: space-between; padding: 0 28px}
.lec-online-list li .right {display: flex; align-items: center}
.lec-online-list li .right .progress {min-width: 130px}
.lec-online-list li .right .lec-time {min-width: 200px}



/******************************
	    LECTURE VIDEO
******************************/
.video-title-box {width: 100%; display: flex; flex-direction: column; align-items: center; margin: 0 0 40px}
strong.video-title {font-size: 24px; font-weight: 500; color: var(--navy); line-height: 1.2; display: block; margin: 0 0 80px; position: relative}
strong.video-title::after {width: 60px; height: 1px; background-color: var(--line-gray2); content: ''; position: absolute; bottom: -40px; left: 50%; transform: translateX(-50%)}
strong.video-sub-title {font-size: 44px; font-weight: 300;  line-height: 1.2}
.lecture-video-area {width: 100%; background: var(--bg-gray4); display: flex; justify-content: center; padding: 60px 0; margin-bottom: 60px}





@media screen and (max-width: 1440px) {
	.sub {min-height: auto; padding: 48px 32px 64px}
	/* Sub-Visual */
	#sub-visual {height: 180px}
	#sub-visual .title-box strong {font-size: 40px}
	#sub-visual .title-box span {margin: 20px 0 0}
	/* 0101-센터장인사말 */
	.s010101::after {content: none}
	.s010101 strong {width: auto; padding-bottom: 30px; font-size: 28px}
	.s010101 strong::after {width: 40px}
	.s010101 p {width: auto; font-size: 16px; line-height: 1.4; margin-top: 25px}
	/* 0103-시설안내 */
	.s010302 li p {width: 80%; height: 40px; font-size: 16px; border-radius: 10px 10px 0 0}
	
	/******************************
		강좌상세	강좌상세	강좌상세
	******************************/
	/* 강좌상세 상단 정보 */
	.lecture-view-top .lec-thumb {width: calc(50% - 24px)}
	.lecture-view-top .lec-thumb img {border-radius: 0 40px 0 40px}
	.lecture-view-top .lec-thumb .basic-img {border-radius: 0 40px 0 40px}
	.lecture-view-top .lec-info {width: calc(50% - 24px)}
	
	/******************************
		    LECTURE VIDEO
	******************************/
	strong.video-title {font-size: 20px; margin: 0 0 60px}
	strong.video-title::after {bottom: -30px}
	strong.video-sub-title {font-size: 32px}
	.lecture-video-area {background: none; padding: 0; margin-bottom: 40px}
}

@media screen and (max-width: 1280px) {
	/******************************
		SUB-TAB	SUB-TAB	SUB-TAB
	******************************/
	ul.sub-tab {margin: 0 0 40px}
	ul.sub-tab li {height: 64px; font-size: 16px}
	
	/******************************
		강좌상세	강좌상세	강좌상세
	******************************/
	/* 강좌상세 상단 정보 */
	.lecture-view-top .lec-info strong.lec-title {font-size: 24px; margin: 0 0 24px}
	.lecture-view-top .lec-info strong.lec-title span.category {font-size: 20px}
	
	/* 강좌상세 - 온라인 학습목록 */
	.lec-online-list li {height: 72px; font-size: 16px; padding: 0 20px}
	.lec-online-list li span.bold {width: calc(100% - 440px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden}
	.lec-online-list li .right .progress {min-width: 120px}
	.lec-online-list li .right .lec-time {min-width: 160px}
}

@media screen and (max-width: 1080px) {
	.sub {padding: 32px}
	/* Sub-Visual */
	#sub-visual {height: 140px}
	#sub-visual .title-box {width: auto; top: auto; bottom: 40px; left: 40px; transform: translate(0); margin: 0}
	#sub-visual .title-box strong {font-size: 28px; font-weight: 600}
	#sub-visual .title-box span {display: none}
	.sub-nav {height: 48px}
	.sub-nav .btn-home {width: 48px; height: 48px; background-size: 24px}
	
	ul.sub-tab {margin: 0 0 24px}
	ul.sub-tab li {height: 48px; font-size: 16px}
	ul.sub-tab li::after {height: 16px}
	ul.sub-tab.down-size li {height: 48px; font-size: 12px}
	
	.sub-title-box {margin: 0 0 20px}
	.sub-title-box.btm-line {padding: 0 0 20px}
	.cont-block+.cont-block {margin-top: 40px}
	.text-box p {font-size: 14px}
	.h2 {font-size: 20px; padding: 0 0 0 16px}
	.h2::before {width: 12px; height: 12px; border: 3px solid var(--intro-purple)}
	.h3 {font-size: 16px}
	p.text {font-size: 14px}
	p.bg {font-size: 14px}
	p.right-comment {font-size: 14px; text-align: left}
	p.right-comment.mb20 {margin-bottom: 8px !important}
	
	/******************************
		강좌상세	강좌상세	강좌상세
	******************************/
	/* 강좌상세 상단 정보 */
	.lecture-view-top {margin: 0 0 32px}
	.lecture-view-top .lec-thumb {width: calc(50% - 16px)}
	.lecture-view-top .lec-thumb img {border-radius: 0 20px 0 20px}
	.lecture-view-top .lec-thumb .basic-img {border-radius: 0 20px 0 20px}
	.lecture-view-top .lec-info {width: calc(50% - 16px)}
	.lecture-view-top .lec-info .state {height: 40px; font-size: 18px}
	.lecture-view-top .lec-info strong.lec-title {font-size: 20px; margin: 0 0 20px}
	.lecture-view-top .lec-info strong.lec-title span.category {font-size: 16px}
	.lecture-view-top .lec-info ul.info-list li {margin: 0 0 16px}
	.lecture-view-top .lec-info ul.info-list li .title {width: 100px}
	.lecture-view-top .lec-info ul.info-list li .info {width: calc(100% - 100px)}
	.lecture-view-top .lec-info .info-button-box2 button {height: 40px; font-size: 16px}
	.lecture-view-top .lec-info .info-button-box3 button {height: 40px; font-size: 16px}
	
	/* 강좌상세 - 온라인 학습목록 */
	.lec-online-list li {height: 64px; padding: 0 12px}
	.lec-online-list li span.bold {width: calc(100% - 400px)}
	.lec-online-list li span.bold .mr20 {margin-right: 12px !important}
	.lec-online-list li .right .btn {font-size: 14px}
	.lec-online-list li .right .btn.lecture {background-position: 8px center; background-size: 16px; padding: 0 12px 0 32px}
	
	/******************************
		    LECTURE VIDEO
	******************************/
	.video-title-box {align-items: flex-start; margin: 0 0 32px}
	strong.video-title {font-size: 18px; margin: 0 0 50px}
	strong.video-title::after {width: 40px; bottom: -28px; left: 0; transform: translate(0)}
	strong.video-sub-title {font-size: 28px}
	.lecture-video-area {margin-bottom: 24px}
}

@media only screen and (max-width: 768px) {
	.sub {padding: 20px 20px 32px}
	#sub-visual .title-box {bottom: 24px; left: 24px}
	.sub-nav {display: none}
	
	ul.sub-tab {margin: 0 0 20px}
	ul.sub-tab li {height: 40px; font-size: 14px}
	ul.sub-tab li::after {height: 12px}
	ul.sub-tab.down-size li {height: 32px}
	
	.sub-title-box {margin: 0 0 12px}
	.sub-title-box.btm-line {padding: 0 0 12px}
	.sub-title-box span.red {font-size: 12px}
	.cont-block+.cont-block {margin-top: 24px}
	.h2 {font-size: 16px}
	.h4 {font-size: 14px}
	.text-box p {font-size: 12px; line-height: 20px}
	p.text {font-size: 12px; line-height: 20px}
	p.bg {font-size: 12px; padding-left: 10px}
	p.bg::before {width: 6px; top: 10px}
	
	/* 0403-FAQ */
	.tab__button {line-height: 1.2; padding: 12px 55px 12px 75px}
	.tab__button-none {line-height: 1.2; padding: 12px 55px 12px 75px}
	.tab__button:after {width: 16px; background-size: 16px}
	.tab__cont {padding: 12px}
	
	/******************************
		강좌상세	강좌상세	강좌상세
	******************************/
	/* 강좌상세 상단 정보 */
	.lecture-view-top {flex-direction: column; justify-content: flex-start; margin: 0 0 32px}
	.lecture-view-top .lec-thumb {width: 100%; margin: 0 0 20px}
	.lecture-view-top .lec-thumb .basic-img {position: relative}
	.lecture-view-top .lec-info {width: 100%}
	.lecture-view-top .lec-info ul.info-list li {font-size: 14px; margin: 0 0 12px}
	
	.lecture-view-cont-area .cont-block .text-box p span {font-size: 12px !important; line-height: 16px}
	
	/* 강좌상세 - 온라인 학습목록 */
	.lec-online-list li {height: 60px; font-size: 14px; padding: 0}
	.lec-online-list li span.bold {width: calc(100% - 340px)}
	.lec-online-list li span.bold .mr20 {margin-right: 8px !important}
	.lec-online-list li .right .progress {min-width: 100px}
	.lec-online-list li .right .lec-time {min-width: 130px}
	
	/******************************
		    LECTURE VIDEO
	******************************/
	.video-title-box {margin: 0 0 24px}
	strong.video-title {font-size: 16px; margin: 0 0 40px}
	strong.video-title::after {width: 32px; bottom: -22px}
	strong.video-sub-title {font-size: 20px}
	.lecture-video-area {margin-bottom: 20px}
}

@media only screen and (max-width: 640px) {
	.sub-title-box {display: block}
	.sub-title-box span.red {display: block; margin-top: 12px}
	
	ul.sub-tab {width: auto; font-size: 0; display: inline-block; margin: 0 0 16px}
	ul.sub-tab li {width: auto; height: 40px; line-height: 40px; background-color: var(--bg-gray2); border-bottom: 0; display: inline-block; border-radius: 20px; padding: 0 16px; margin: 0 4px 8px 0}
	ul.sub-tab li:first-child {margin-left: 0}
	ul.sub-tab li::after {content: none}
	ul.sub-tab li.on {color: #fff; background-color: var(--navy); border: 0; border-width: 0}
	
	/******************************
		강좌상세	강좌상세	강좌상세
	******************************/
	/* 강좌상세 상단 정보 */
	.lecture-view-top .lec-info .state {font-size: 16px}
	.lecture-view-top .lec-info strong.lec-title {font-size: 18px}
	.lecture-view-top .lec-info strong.lec-title span.category {font-size: 14px}
	.lecture-view-top .lec-info ul.info-list li .info.type-box .type {width: 72px; height: 24px; font-size: 12px}
	.lecture-view-top .lec-info ul.info-list {margin: 0 0 12px}
	.lecture-view-top .lec-info .info-button-box1 {padding: 0 0 12px; margin: 0 0 12px}
	.lecture-view-top .lec-info .info-button-box1 button {font-size: 12px}
	.lecture-view-top .lec-info .info-button-box2 button {font-size: 14px}
	.lecture-view-top .lec-info .info-button-box3 button {font-size: 14px}
	.lecture-view-top .lec-info .info-button-box3 {margin: 12px 0 0}
	
	.lecture-view-cont-area .sub-title-box .btn {margin-top: 12px}
	
	/* 강좌상세 - 온라인 학습목록 */
	.lec-online-list li {height: auto; font-size: 16px; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 12px}
	.lec-online-list li span.bold {width: 100%; line-height: 1.4; margin: 0 0 12px; text-overflow: initial; white-space: normal; overflow: visible}
	.lec-online-list li .right {width: 100%; font-size: 14px; display: inline-block}
	.lec-online-list li .right .progress {min-width: auto; margin-right: 12px}
	.lec-online-list li .right .lec-time {min-width: auto}
	.lec-online-list li .right .btn {width: 100%; margin: 12px 0 0}
	.lec-online-list li .right .btn.lecture {background-image: none; position: relative}
	.lec-online-list li .right .btn.lecture::after {width: 16px; height: 16px; background: url('/img/lms/sub/icon-play.svg') no-repeat; content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-36px, -50%)}
}

@media only screen and (max-width: 480px) {
	.lec-online-list li {padding: 12px 0}
	.lec-online-list li span.bold {font-size: 14px}
	
	/******************************
		    LECTURE VIDEO
	******************************/
	.video-title-box {margin: 0 0 20px}
	strong.video-title {font-size: 14px; margin: 0 0 16px}
	strong.video-title::after {content: none}
	strong.video-sub-title {font-size: 16px}
}

/*조직도*/
.img-wrap{}
.org-img{text-align:center;border:1px solid #ebebeb;width:100%;padding:50px;margin-bottom:30px}
.org-img img{max-width:1279px;width:90%}
@media only screen and (max-width: 600px) {
	.org-img{padding:30px}
}

/*문의하기*/
.inquiry-text{font-family: 'S-CoreDream';font-weight:500;font-size:30px;color:#000;text-align:center;letter-spacing:-2px}
.inquiry-wrap{background:#eef6f9;width:100%;border-radius:30px;display:flex;padding:70px 60px;margin-top:30px}
.inquiry-wrap .inquiry01{width:50%;background:url(/img/lms/sub/img_call01.png) right 40px center no-repeat;}
.inquiry-wrap dl{color:#000;position:relative}
.inquiry-wrap dt{font-family: 'S-CoreDream';font-size:26px;padding-right:41px;position:relative;display:inline-block;line-height:41px;margin:15px 0}
.inquiry-wrap dd{font-family: 'S-CoreDream';font-size:40px;font-weight:600;margin-bottom:15px}
.inquiry-wrap .inquiry01 dt{}
.inquiry-wrap .inquiry01 dt:after{content:'';position:absolute;width:41px;height:41px;top:0;right:-10px;background:url(/img/lms/sub/icon_call01.png) no-repeat}
.inquiry-wrap .inquiry01 dd{}
.inquiry-wrap .inquiry02{width:50%;background:url(/img/lms/sub/img_email01.png) right center no-repeat}
.inquiry-wrap .inquiry02 dt{}
.inquiry-wrap .inquiry02 dt:after{content:'';position:absolute;width:41px;height:41px;top:0;right:-10px;background:url(/img/lms/sub/icon_email01.png) no-repeat}
.inquiry-wrap .inquiry02 dd{}
@media only screen and (max-width: 1400px) {
	.inquiry-wrap{padding:70px 40px}
	.inquiry-wrap .inquiry01{background-size:180px}
	.inquiry-wrap .inquiry02{background-size:180px}
	.inquiry-wrap dt{font-size:20px}
	.inquiry-wrap dd{font-size:30px}

}
@media only screen and (max-width: 1080px) {
	.inquiry-wrap{display:block;padding:30px 40px}
	.inquiry-wrap .inquiry01{width:100%;background-position:right center}
	.inquiry-wrap .inquiry02{border-top: 1px solid #ebebeb;padding-top:20px;width:100%;background-position:right top 30px}
	
}
@media only screen and (max-width: 768px) {
	.inquiry-text{margin-top:40px}
	
}

@media only screen and (max-width: 600px) {
	.inquiry-text{font-size:20px;line-height:180%}
	.inquiry-wrap .inquiry01{background-size:100px}
	.inquiry-wrap .inquiry02{background-size:100px;background-position:right top 51px}
	.inquiry-wrap dt{font-size:16px}
	.inquiry-wrap dd{font-size:18px}
}
@media only screen and (max-width: 400px) {
	.inquiry-wrap .inquiry01{background:none}
	.inquiry-wrap .inquiry02{background:none}
	
}

/*채용공고*/
.img_box{}
.img_box .img_main{max-width:800px;margin:30px auto}
.img_box .img_etc{display:flex;gap:0 1px }
.img_box .img_etc div{width:25%;vertical-align:top}
.img_box .img_etc div img{width: 100%;aspect-ratio: 4 / 3;object-fit:fill;}

.s0501 .search-box .search-form .searchName{color:#000;}
.s0501 .lecture-list {margin-bottom : 20px;}
.s0501 ul.lecture-list li.item .info dl.sub-info dt {width:75px;}
.s0501 ul.lecture-list li.item .thumb .basic-img::after {background:none;text-align:center;}
.s0501 .search-box {display:flex;justify-content:center; background: #f9f9f9; padding: 20px; }
.s0501 .search-box .search-form {display:block;padding: 10px 0;}
.s0501 .search-box .search-form.search-form01{margin-right:30px}
.s0501 .search-box .search-form.search-form02{margin-right:30px}
.s0501 .search-box .search-form .searchName {margin-right:10px;}
.s0501 .search-box .search-form span{padding-top:10px;}
.s0501 .search-box .search-form label {padding-top:10px; cursor: pointer;}
.s0501 .search-box .search-form label input {opacity: 1; position: relative; width: auto; height: auto; margin-left: 10px; margin-right: 5px; }
.s0501 .search-box .search-form #searchDateStart {width:140px;background:#ffffff;}
.s0501 .search-box .search-form #searchDateEnd {width:140px;background:#ffffff;}

@media only screen and (max-width: 1330px) {
	.s0501 .search-box{display:block;text-align:center}
	.s0501 .search-box .search-form.search-form01{display:inline-block}
	.s0501 .search-box .search-form.search-form02{display:inline-block}
	.s0501 .search-box .search-form.search-form03{display:block}
	.s0501 .search-box .search-form.search-form03 input[type=text]{width:300px}
	
}
@media only screen and (max-width: 1080px) {
	.s0501 .search-box .btn.search{vertical-align:top}
	.s0501 .search-box .search-form.search-form03 .btn.reset{vertical-align:top}
	.s0501 .search-box .search-form.search-form03 input[type=text]{vertical-align:top}
	.s0501 .search-box .search-form input{margin-bottom:0}

}
@media only screen and (max-width: 670px) {
.s0501 .search-box .search-form.search-form03 input[type=text]{width:200px}
}
@media only screen and (max-width: 600px) {
.s0501 .search-box input#searchWord {width:calc(100% - 163px)}
.s0501 .search-box .search-form{padding:7px 0}
.s0501 .search-box .search-form.search-form02{margin-top:10px}
.s0501 .search-box .search-form.search-form03{margin:0 auto}	

}


@media only screen and (max-width: 500px) {
	.s0501 .search-box #searchType.select{width:160px}
	.s0501 .search-box .btn.search{width:100%}
	.s0501 .search-box .search-form.search-form03 .btn.reset{width:100%;margin-top:5px}
}
@media only screen and (max-width: 445px) {
	.s0501 .search-box .search-form{padding:0 0 10px 0}
	.s0501 .search-box .search-form.search-form01 .searchName{width:100%;display:block;margin-bottom:10px}
	.s0501 .search-box .search-form.search-form02 .searchName{width:100%;display:block;margin-bottom:10px}
	.s0501 .search-box .search-form #searchDateStart{width:calc(50% - 10px)}
	.s0501 .search-box .search-form #searchDateEnd{width:calc(50% - 10px)}
	.s0501 .search-box .search-form.search-form03{width:100%}
	.s0501 .search-box #searchType.select{width:calc(50% - 10px)}
	.s0501 .search-box input#searchWord{width:calc(50% - 10px);margin-left:8px}
}
@media only screen and (max-width: 370px) {
	.s0501 .search-box #searchType.select{width:100%;margin-bottom:3px}
	.s0501 .search-box input#searchWord {width:100%;margin-bottom:3px;margin-left:0}

	.s0501 .search-box .search-form label{width:48%;text-align:left;display:inline-block}
	
}