textarea { width: 98%}
input[type="text"],
input[type="password"]{height: 36px;line-height: 36px;font-size: 16px;border: 1px solid #ccc;text-indent: 10px;vertical-align: top;}
.infolist li img { width:40px; height:40px;}
.infolist li { margin-bottom:5px;}
.infolist li label { width:50px; height:40px; line-height:40px; display:inline-block;}
.infolist.infomsub li label { width:100px; vertical-align:top;}

.size2 { font-size:30px;}
.size3 { font-size:26px;}
.size4 { font-size:22px;}
.size5 { font-size:18px;}
.size6 { font-size:14px;}

.infobox .infobox-s ul li { list-style-type: disc;}
.infobox .infofilelist {display:block; margin-bottom:10px;}
.infobox .infofilelist a { line-height:40px;}

.ar_point > div{ background:#f3f3f3; border-radius:5px; }
.helpbox { display:none; width:100%; padding:20px 0; margin-left:50px;}
.mber-modify { margin:10px 0; text-align:center;}
.modifybox { margin-bottom:0; padding-bottom:0;}
.modifybox .mber-detail { padding:0}
.modifybox .mber-detail ul li { height:45px; line-height:45px;}
.modifybox .mber-detail input[type="text"],
.modifybox .mber-detail input[type="password"] { height:28px; line-height:28px; vertical-align: middle; }
.modifybox .mber-detail input[type="file"] { padding:4px 10px; border:1px solid #ccc }

.modifytitlebox { padding-bottom:10px; border:0; margin-top:20px;}
.modifytitlebox .infobox-t { width:100%; text-align: center; font-size:25px;}
.modifylistbox .col-2 .sinfobox {width:100%; }
.modifylistbox .mber-detail ul li {padding:7px 0; border-bottom:0; border-bottom:1px solid #f2f2f2;}
.modifylistbox .mber-detail ul li span:nth-child(2) { text-align:left;}
.modifylistbox .mber-detail input[type="text"],
.modifylistbox .mber-detail input[type="password"],
.modifylistbox .mber-detail input[type="file"] { width:100%; height: 36px; line-height: 36px; font-size: 16px; border: 1px solid #ccc; text-indent: 10px; box-sizing:border-box; vertical-align: middle; }
.modifylistbox .mber-detail input[type="file"] { padding:0;}

.modifylistbox .sinfo-ing .btn:nth-child(even) { float:right;}
.modifylistbox .noprof { text-align:center; font-size:26px; padding:20px 0;}
#description { box-sizing:border-box; padding-left:5px; height:65px;}

.sinfobox{overflow:hidden;position:relative;}

/*.sinfo-ingw{float:left;width:160px;}*/
.sinfobox .mber-detail{position:relative; box-sizing:border-box; /*padding:30px 10px;*/}
.sinfobox .mber-detail ul li{padding:5px 0;overflow:hidden; }
.sinfoboxw{border-bottom:1px solid #d2d2d2;padding-bottom:50px;margin-bottom:50px;}

.mbertit{font-size:28px;color:#3f3f3f;font-weight:600;padding-bottom:17px; border-bottom:1px solid #e3e3e3;}
.mberboxtit{font-size:16px;color:#383838;font-weight:600;}
.mber-detail .mberlist li{border-bottom:none;font-size:15px;position:relative;padding-left:11px;}
/*.mber-detail .mberlist li:before{width:4px;height:4px;position:absolute;left:2px;top:15px;content:'';display:block;border-radius:10px;background:#ac9f9f;}*/
.mbc{background:#f8f8f8; border:1px solid #ddd; padding:10px 20px; margin-top:25px;}
.mber-title{color:#3f3f3f; font-size:28px; font-weight:bold; padding-bottom:5px;}
.mber-title>span{font-size:18px; font-weight:500;}
.mtel{display:inline-block;background:url("../img/sub/stel.png") 10px center no-repeat;margin-right:20px;}
.memail{display:inline-block;background:url("../img/sub/semail.png") 10px center no-repeat;}
.mtel>i, .memail>i{background:#064593; color:#fff; width:27px; height:27px; border-radius:50px; line-height:27px; text-align:center; margin-right:3px;}
.mbtit{display:inline-block;padding-right:10px;color:#3f3f3f !important;font-size:18px;font-weight:500;}
.mbstit{display:inline-block;color:#3f3f3f;font-size:18px;font-weight:500;opacity:0.7;}

/*-----style변경-----*/
/*list*/
.arrange_item{display:grid; grid-template-columns:repeat(2, 1fr); grid-column-gap:2%;}
.arrange_item .sinfobox{box-sizing: border-box; position:relative; margin-bottom:50px; padding:20px 15px; border:1px solid #ddd; display: grid; grid-template-columns:minmax(180px, 240px) auto;  grid-column-gap:4%; align-items: center; }
.mberbox{display:grid; grid-template-columns:80px auto; border-bottom:1px solid #e3e3e3; padding:7px 0; align-items: center;}
.mber-title{color: #3f3f3f; font-size: 30px; font-weight: 700; }
.mber-detail>ul>li>dl{display:grid; grid-template-columns:90px auto; align-items:center;}
.mber-detail>ul>li>dl>dt{font-weight:600;}
.mber-detail .mberlist li{box-sizing: border-box; color:#777777; letter-spacing: 0px; font-weight:400; word-break: break-word;}
.profbtnbox{margin-top:10px;}

.info_btn_wrap{display: flex; justify-content: flex-end; position: absolute; right:0 ; top:-10px;}
.info_btn_wrap a.btn{padding:0 10px; width:auto; min-width:100px;}
@media only all and (max-width:500px){
	.info_btn_wrap{position: static;}
}

/*write*/
.col-2{border-top:3px solid #222; border-bottom:1px solid #e3e3e3; position: relative;}
.col-2:after{content:""; display:inline-block; width:150px; height:1px; background:#222; position:absolute; bottom:0; left:50%; transform:translateX(-50%);}
.profile{text-align: center; margin-top:10px;}
.profile>a{width:133px;}
.professor_career{padding:30px 0; border-bottom:2px solid #222;}
.professor_career li+li{margin-top:10px;}
.professor_career dl dt{font-weight:600; font-size:18px; margin-bottom:10px;}
.professor_career .textarea {width:100%; border:1px solid #dee0e4; height:130px; padding:0 3px;}
.modifylistbox{
	& .sinfobox{display: grid; grid-template-columns:minmax(260px, 300px) auto; grid-column-gap:3%; align-items: center;}
	& .sinfo-ing { text-align:center;  padding:15px 10px; height:100%; box-sizing: border-box;}
	& .sinfo-ing img{object-fit: contain;}
	& .sinfo-ing .btn {font-size:16px; margin-top:7px; height:42px; line-height: 42px; width:100%; background:#e8eaed; border:1px solid #e8eaed; color:#222;}
	& .sinfobox .mber-detail ul li{padding:10px 0;}
	& .mber-detail>ul>li>dl{grid-template-columns: 130px auto;}
	& .col-2:after{display: none;}
	& .profbtnbox a.del{background:#d73333; color:#fff;}
}
.modifylistbox .professor_career{
	& dl{position: relative;}
	& dl dt{ font-size:28px; margin-top:25px; padding-top:25px; border-top:1px solid #222;}
	& .add-btn-container{position: absolute; right:0; top:10px; padding-right:0;}
}
.image-preview-container{display: grid; grid-template-columns: 70px auto; align-items: center; border:1px solid #ddd; background:#f7f7f7; 
	& img{height:100%; width: 100%; box-sizing: border-box; padding:7px;}
}

/*view*/
.view_wrap{border-top:2px solid #222;	
	& .arrange_item{display:block; width:100%;}
	& .sinfobox{border-left:none; border-right:none; padding:0; grid-template-columns:minmax(260px, 300px) auto; position: relative;}
	& .sinfobox:after{content:""; display:inline-block; width:150px; height:1px; background:#222; position:absolute; bottom:0; left:50%; transform:translateX(-50%);}
	& .sinfobox .sinfo-ingw{box-sizing: border-box; background:#f7f7f7; width:100%; height:100%; padding:15px 10px; display: flex; flex-flow:column wrap; justify-content: center; align-items: center;}
	& .mberbox{grid-template-columns:140px auto; padding:10px 0;}
	& .mbertit{font-size: 32px; font-weight:700;}
	& .mberboxtit{font-size:18px;}
	& .mber-detail .mberlist li{font-size:16px;}

}
.view_wrap .professor_career{padding:10px 0 80px;
	& li+li{margin-top:70px;}
	& dl dt{position: relative; font-size:30px; margin-bottom:25px;}
	& dl dd{margin-top:25px; font-size:16px; color:#818181; font-weight:400; }
	& div[class*="item"]{display: grid; grid-template-columns: 160px auto;}
	& .education-year, .career-period {font: 600 18px 'Arial'; color:#acadb1; }
	& div[class*="description"]{color:#262626; letter-spacing: -0.5px;}
} 

.hidden {display: none;}
.entry-row {
    display: grid;	
    grid-template-columns:230px auto 80px;
    margin-bottom: 15px;
    align-items: center;
     background:#f6f6f6; 
    /*max-width: 1300px;*/}
.year-fields {
    display: flex;
    align-items: center;
    justify-content: center;
    padding:7px	0; 
    border-left:3px solid #cfd1d3;
    /*width: 220px;*/}
.year-field {
    width: 90px;
    /*padding: 6px;*/
    border: 1px solid #ddd;}
.year-fields span {margin: 0 5px;}
.description-field {
    flex: 1;
    padding:7px 10px 7px 5px ;
    /*margin: 0 10px ;
    max-width: 60%;*/}
.description-input {
    width: 100%;
    /*padding: 6px;*/
    border: 1px solid #ddd;}
.entry-actions {
    /*width: 60px;*/
    text-align: right;
    padding:7px 10px;
    }
.remove-btn {
    background-color: #f44336;
    color: white;
    border: none;
    padding: 8px 8px;
    cursor: pointer;
    font-size:16px;
    width:100%;
    border-radius: 3px;}
.add-btn-container {
    text-align: right;
    margin-top: 10px;
    margin-bottom: 15px;
    padding-right: 60px;}
.add-btn {
    background-color: #3264c5;
    color: white;
    border: none;
    padding: 7px 38px;
    font-size:16px;
    cursor: pointer;}
#education-container, #career-container {
    margin-bottom: 0;
    width: 100%;
    /*max-width: 1300px;*/
}
@media only all and (max-width: 1200px){
	.arrange_item{display:grid; grid-template-columns:repeat(1, 1fr); }
	.profile>a, .mber-modify>a{height:30px; line-height:30px;}
	.view_wrap .arrange_item .sinfobox{grid-template-columns: 200px auto;}
}

@media only all and (max-width: 760px){
	.infolist li .infofilelist { width:98%; display:block; margin:5px 0}
	.infolist li label { width:20%!important;}
	.mber-stitle {font-size:20px;}
	.arrange_item{display:block;}
	.modifylistbox .sinfobox{margin-bottom:10px; grid-template-columns:repeat(1, 1fr);}
	.sinfobox .mber-detail{padding-left:0; margin-top:20px; }
	
	.mberbox{padding:0;}
	.profile>a{width:85px; padding:0;}
	.sinfo-ingw .sinfo-ing{max-width:280px;}
	.arrange_item .sinfobox{grid-template-columns: 1fr 2fr;}
	.view_wrap .mberbox,
	.view_wrap .arrange_item .sinfobox{grid-template-columns: repeat(1, 1fr);}
	.view_wrap .sinfobox .sinfo-ingw{width: 100%;}
	.view_wrap .mber-detail .mberlist li{padding-left:0;}
}

@media only all and (max-width: 650px){
	.view_wrap .professor_career div[class*="item"]{grid-template-columns: repeat(1, 1fr);}
	
	.entry-row{grid-template-columns: repeat(1, 1fr);}
	.year-fields{padding:10px 5px 5px 5px; justify-content: flex-start; border-left:none; border-top:3px solid #cfd1d3;}
	.description-field{padding: 0 5px;}
	.entry-actions{justify-self: flex-end; padding:7px 5px ;}
}

@media only all and (max-width: 500px){
	.arrange_item .sinfobox{grid-template-columns: repeat(1, 1fr);}
	.sinfo-ingw{justify-self:center;}
	.info_btn_wrap{justify-content: center;}

	

}
