
.sub_page input[type="text"], input[type="password"], .select, textarea, input[type="url"], input[type="number"], input[type="email"], input[type="tel"] {border: 1px solid #ddd; padding: 7px 7px; background-color: #fff; transition: 0.4s border; font-size:14px}
.sub_page input[type="text"], input[type="password"], .select, input[type="url"], input[type="number"], input[type="email"], input[type="tel"] {display:inline-block; height: 20px; vertical-align:top;}
.sub_page input[type="text"]:focus, input[type="password"]:focus, .select:focus, textarea:focus, input[type="url"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="tel"]:focus {border-color: #000; outline: none;}

.sub_page input[type="radio"], input[type="checkbox"] {}
.sub_page input[disabled="disabled"], input[disabled] {background: #eee;}
.sub_page input[type="file"] {height:30px; line-height:30px}
.sub_page textarea {width:95%; box-sizing:border-box; padding:10px}
.sub_page select {min-width:80px; padding:0 9px; border:1px solid #ddd; border-radius:0 !important; background:#fff !important; vertical-align:middle; height:36px !important; line-height:36px; box-sizing:border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size:14px}
.sub_page input:focus::-webkit-input-placeholder {color:transparent}  /* chrome */ 
.sub_page input:focus::-moz-placeholder {color:transparent}           /* firefox */  
.sub_page input[type="text"].wide {width:100%; box-sizing:border-box; height:30px}
.sub_page .datepicker {background:url('/images/comm/ico_calender.gif') right center no-repeat; width:110px}

.wd60 {width:60px}
.wd80 {width:80px}
.wd100 {width:100px}
.wd150 {width:150px}
.wd200 {width:200px}
.wd300 {width:300px}
.wd400 {width:400px}
.wd600 {width:600px}



@media all and (max-width:800px){

	textarea,
	.inp_txt {width:100% !important; box-sizing:border-box}
	.sub_page input[type="text"], input[type="password"], .select, input[type="url"], input[type="number"], input[type="email"], input[type="tel"] {height:36px !important; box-sizing:border-box}

}

@media all and (max-width:640px){
	
	.sub_page input[type="text"], input[type="password"], .select, input[type="url"], input[type="number"], input[type="email"], input[type="tel"] {height:30px !important; font-size:14px}
	.sub_page select {height:30px !important; font-size:14px; line-height:30px}
	.sub_page select {min-width:50px}

}

/* Button Reset */
.sub_page .button{ position:relative; overflow: visible; display:-moz-inline-stack; display:inline-block; margin-bottom:5px;/* margin:0 2px; */ padding:0; vertical-align: top;  white-space: nowrap; font-weight:400; text-decoration:none; border-radius: 3px; color:#fff; background-color:#3378c1; border:0px solid #245fa3; border-width:0 1px 1px 0; box-sizing:border-box; cursor:pointer; font-size:12px}
.sub_page a.button { margin-bottom:5px; cursor:pointer} 
.sub_page p.button { cursor: no-drop; }

/* Button Size */
.sub_page .button.ssmall { height: 24px; padding:0 12px; line-height: 20px; font-size: 14px; }
.sub_page .button.small { height: 35px; padding:0 12px; line-height: 35px; font-size: 14px; }
.sub_page .button.medium { height: 37px; padding: 0 20px; line-height:37px; font-size:18px;} 
.sub_page .button.large { height: 44px; padding:0 22px; line-height:44px; font-size:20px;}

@media all and (max-width:768px){

	.sub_page .button.small {height: 30px; padding:0 12px; line-height: 30px; font-size: 14px; }
	.sub_page .button.medium { height: 32px; padding: 0 20px; line-height:32px; font-size:16px;} 
	.sub_page .button.large { height: 38px; padding:0 22px; line-height:38px; font-size:16px;}

}

@media all and (max-width:640px){

	.sub_page .button.small {height: 30px; padding:0 12px; line-height: 30px; font-size: 14px; }
	.sub_page .button.medium { height: 32px; padding: 0 15px; line-height:32px; font-size:14px;} 
	.sub_page .button.large { height: 34px; padding:0 15px; line-height:34px; font-size:14px;}

}

/* Button Color */
.sub_page .button.search_btn {border:1px solid #999; border-width:0 1px 1px 0; color:#fff; background:#999;  box-sizing:border-box; border-radius: 0px;}
.sub_page .button.gray {border:1px solid #666; border-width:0 1px 1px 0; color:#fff; background:#666;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.gray_02 {border:1px solid #999; border-width:0 1px 1px 0; color:#fff; background:#999;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.white {border-top:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #c7c7c7; border-bottom:1px solid #c7c7c7; border-width:1px 1px 1px 1px; box-sizing:border-box; color:#444; background:#fcfcfc; border-radius: 3px;}
.sub_page .button.white_02 {border:1px solid #2a6fb7; color:#2a6fb7; background:#fff;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.blue {border:1px solid #2c64b1; border-width:0 1px 1px 0; color:#fff; background:#3378c1;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.blue_02 {border:1px solid #78abe2; border-width:0 1px 1px 0; color:#fff; background:#78abe2;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.red {border:1px solid #f45656; border-width:0 1px 1px 0; color:#fff; background:#fa6565;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.red_02 {border:1px solid #f59696; color:#fff; background:#f59696;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.etc_01 {border:1px solid #a268ba; border-width:0 1px 1px 0; color:#fff; background:#a974bf;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.etc_02 {border:1px solid #37b4b5; border-width:0 1px 1px 0; color:#fff; background:#40c1c2;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.etc_03 {border:1px solid #3b8fc2; color:#fff; background:#3b8fc2;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.etc_04 {border:1px solid #80a9d0; color:#fff; background:#80a9d0;  box-sizing:border-box; border-radius: 3px;}
.sub_page .button.etc_05 {border:1px solid #ba9e80;  color:#fff; background:#ba9e80;  box-sizing:border-box; border-radius: 3px;}

/* Button Hover */
.sub_page .button.search_btn:hover,
.sub_page .button.search_btn:active,
.sub_page .button.search_btn:focus { border:1px solid #666; border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#888;} 
.sub_page .button:hover,
.sub_page .button:active,
.sub_page .button:focus {border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#194478;}
.sub_page .button.gray:hover,
.sub_page .button.gray:active,
.sub_page .button.gray:focus { border:1px solid #666; border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#555;} 
.sub_page .button.gray_02:hover,
.sub_page .button.gray_02:active,
.sub_page .button.gray_02:focus { border:1px solid #888; border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#888;} 
.sub_page .button.white:hover,
.sub_page .button.white:active,
.sub_page .button.white:focus { border:1px solid #ddd; box-sizing:border-box; color:#555; text-decoration:none; background:#ededed; } 
.sub_page .button.white_02:hover,
.sub_page .button.white_02:active,
.sub_page .button.white_02:focus { border:1px solid #3378c1; color: #16569a; box-sizing:border-box; text-decoration:none; background:#fff;} 
.sub_page .button.blue:hover,
.sub_page .button.blue:active,
.sub_page .button.blue:focus {border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#194478;}
.sub_page .button.blue_02:hover,
.sub_page .button.blue_02:active,
.sub_page .button.blue_02:focus {border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#6594c7;}
.sub_page .button.red:hover,
.sub_page .button.red:active,
.sub_page .button.red:focus { border:1px solid #f45656; border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#f45656;} 
.sub_page .button.red_02:hover,
.sub_page .button.red_02:active,
.sub_page .button.red_02:focus  {border:1px solid #f38b8b; color:#fff; background:#f38b8b;  box-sizing:border-box; border-radius: 3px;text-decoration:none;}
.sub_page .button.etc_01:hover,
.sub_page .button.etc_01:active,
.sub_page .button.etc_01:focus { border:1px solid #a268ba; border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#a268ba;} 
.sub_page .button.etc_02:hover,
.sub_page .button.etc_02:active,
.sub_page .button.etc_02:focus { border:1px solid #37b4b5; border-width:0 1px 1px 0; color: #fff; box-sizing:border-box; text-decoration:none; background:#37b4b5;} 
.sub_page .button.etc_03:hover,
.sub_page .button.etc_03:active,
.sub_page .button.etc_03:focus  {border:1px solid #308ac0; color:#fff; background:#308ac0;  box-sizing:border-box; border-radius: 3px;text-decoration:none;}
.sub_page .button.etc_04:hover,
.sub_page .button.etc_04:active,
.sub_page .button.etc_04:focus  {border:1px solid #6ea0cf; color:#fff; background:#6ea0cf;  box-sizing:border-box; border-radius: 3px;text-decoration:none;}
.sub_page .button.etc_05:hover,
.sub_page .button.etc_05:active,
.sub_page .button.etc_05:focus  {border:1px solid #bb946a;  color:#fff; background:#bb946a;  box-sizing:border-box; border-radius: 3px;text-decoration:none;}

.sub_page input[type="submit"].button.icon:hover,
.sub_page input[type="button"].button.icon:hover,
.sub_page input[type="submit"].button.icon:active,
.sub_page input[type="button"].button.icon:active,
.sub_page input[type="submit"].button.icon:focus,
.sub_page input[type="button"].button.icon:focus { background-image:url('images/icon_button_w.png'); background-repeat:no-repeat; background-color:#194478}
.sub_page input[type="submit"].button.icon.color:hover,
.sub_page input[type="button"].button.icon.color:hover,
.sub_page input[type="submit"].button.icon.color:active,
.sub_page input[type="button"].button.icon.color:active,
.sub_page input[type="submit"].button.icon.color:focus,
.sub_page input[type="button"].button.icon.color:focus { background-image:url('images/icon_button_w.png'); background-repeat:no-repeat;}
.sub_page input[type="submit"].button.icon.white:hover,
.sub_page input[type="button"].button.icon.white:hover,
.sub_page input[type="submit"].button.icon.white:active,
.sub_page input[type="button"].button.icon.white:active,
.sub_page input[type="submit"].button.icon.white:focus,
.sub_page input[type="button"].button.icon.white:focus { background-image:url('images/icon_button_b.png'); background-repeat:no-repeat; background-color:#ededed}

.fu_container {border:1px solid #d7d8d8; border-radius:3px; background-color:#f7f7f7; zoom:1}
.fu_container .fu_dropzone {padding:12px; border:1px solid #fafafa; background-color:#f7f7f7; border-radius:3px; box-sizing:border-box; -moz-box-sizing:border-box}
.fu_container .fu_dropzone.in {background-color:#E9F3EF}
.fu_container .fu_dropzone.hover {border:1px dotted #9ad18f; border-radius:5px}
.fu_container .fu_dropzone.fade {-webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -ms-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out; opacity:1}
.fu_container .fu_btn {display:inline-block; *display:inline; margin:0; padding:0 12px !important; height:24px !important; overflow:visible; border:1px solid #bbbbbb; border-radius:2px; text-decoration:none !important; text-align:center; vertical-align:top; line-height:24px !important; font-family:inherit; font-size:12px; color:#333333; *zoom:1; cursor:pointer; box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); background-color:#f5f5f5; *background-color:#e6e6e6; background-image:-moz-linear-gradient(top, #ffffff, #e6e6e6); background-image:-webkit-linear-gradient(top, #ffffff, #e6e6e6); background-image:-webkit-gradient(top, #ffffff, #e6e6e6); background-image:-o-linear-gradient(top, #ffffff, #e6e6e6); background-image:linear-gradient(top, #ffffff, #e6e6e6); background-repeat:repeat-x; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0); filter:progid: DXImageTransform.Microsoft.gradient(enabled=false)}
.fu_container input.fu_btn,
.fu_container button.fu_btn {height:26px !important}
.fu_container .fu_btn:hover,
.fu_container .fu_btn:active,
.fu_container .fu_btn[disabled] {color:#333; background-color:#e6e6e6; *background-color:#d9d9d9}
.fu_container .fu_btn>span {display: inline-block; *zoom: 1; margin: 0 -12px !important; padding: 0 12px !important; overflow: visible; width: auto; height: 24px; border: 0; vertical-align: top; text-decoration: none !important; line-height: 24px; font-family: inherit; font-size: 12px; color: #333; cursor: pointer; background: none}
.fu_container .fu_act_selectfile {overflow:hidden !important; display:inline-block; vertical-align:middle}
.fu_container .fileinput_button {position: relative; overflow: hidden}
.fu_container .fileinput_button input {position: absolute; top: 0; right: 0; margin: 0; opacity: 0; -ms-filter: 'alpha(opacity=0)'; font-size: 200px !important; direction: ltr; cursor: pointer}
.fu_container p.fu_dropzone_message {display: inline-block; margin: 0; margin-left: 5px; line-height: 24px; vertical-align: middle}
.fu_container p.upload_info {display:none; line-height:24px; vertical-align:middle}
.fu_container .fu_dropzone .xefu_progress_status {margin:12px 0}
.fu_container .fu_dropzone:hover p.fu_dropzone_message,
.fu_container .in .fu_dropzone p.fu_dropzone_message,
.fu_container .hover .fu_dropzone p.fu_dropzone_message,
.fu_container .fade .fu_dropzone p.fu_dropzone_message {display:none}
.fu_container .fu_dropzone:hover .upload_info,
.fu_container .in .fu_dropzone .upload_info,
.fu_container .hover .fu_dropzone .upload_info,
.fu_container .fade .fu_dropzone .upload_info {display:inline-block; margin:0; margin-left:5px}

/* Fixes for IE < 8 */
@media screen\9 {
.fu_container .fileinput_button input {filter:alpha(opacity=0); font-size:100%; height:100%}
}

.fu_container .progress {height:5px;/*margin-bottom:20px;*/overflow:hidden;background-color:#f5f5f5; display:none}
.fu_container .progress_bar {float:left; width:0; height:100%; background:#428bca; width:30%}
.fu_container .fu_controll {display:none; padding:10px}

.clearfix:before,
.clearfix:after {content: " "; display:table}
.clearfix:after {clear: both}
.clearfix {zoom:1}

.fu_container .fu_list {display:none; padding:0 10px; background:#f7f7f7}
.fu_container .fu_list_images {max-height:160px; overflow-y:scroll; -webkit-overflow-scrolling:touch; margin:0 -5px; padding:5px 0; border-bottom:1px solid #E6E6E6}
.fu_container .fu_list_images ul,
.fu_container .fu_list_images li {list-style:none; margin:0; padding:0}
.fu_container .fu_list_images li {position:relative; display:inline-block; margin:3px; width:60px; height:60px; border:3px solid #DDD}
.fu_container .fu_list_images input {position:absolute; top:0; left:0}
.fu_container .fu_act_set_cover:hover {color:red}
.fu_container .fu_list_images .fu_act_set_cover {display:none; cursor:pointer; position:absolute; top:0; left:auto; right:0; margin:0; padding:1px 0 1px 2px; border:0 none; border-radius:0 0 0 5px; font-size:15px; line-height:15px; background-color:#6cbd7e;}
.fu_container .fu_list_images li:hover .fu_act_set_cover {display:inline; color:#666; background-color:#ddd}
.fu_container .fu_list_images .fu_is_cover_image:hover .fu_act_set_cover,
.fu_container .fu_is_cover_image .fu_act_set_cover {display:inline; color:#fff; background-color:#6cbd7e}
.fu_container .fu_is_cover_image {border-color:#6cbd7e !important}
.fu_container .fu_list_images .fu_file_name,
.fu_container .fu_list_images .fu_file_size {display:none}
.fu_container .fu_list_images li img {width:100%; height: 100%}
.fu_container .fu_list .fu_list_files {margin:5px 0}
.fu_container .fu_list_files ul,
.fu_container .fu_list_files li {list-style:none; margin:0; padding:0; float:none}
.fu_container .fu_list_files li {padding: 5px 10px}
.fu_container .fu_list_files li input {vertical-align:middle}
.fu_container .fu_list_files li.selected {background-color:#E9F3EF}
.fu_container .fu_list_files .fu_file_info {float:right}
.fu_container .fu_list_files .fu_file_info span {padding:0 5px}
