@charset "UTF-8";

/* CSS Document */
#header { padding: 34px 0 0 0; height: 73px; position: fixed; width: 100%; top: 0; z-index: 901; max-width: 780px; left: 50%; margin-left: -390px;}
.main-img { margin-top: -22px; }
#header.intro-header { padding: 0; height: 0 }
.intro { padding-top: 100px; background-image: url("../images/bg_header.png"); background-size: contain; background-repeat: no-repeat; }
.img-intro-login { text-align: center; }
.img-intro-login img { width: 52%; min-width: 240px; }
.intro-txt { margin: 0 auto; width: 81%; margin-top: 30px; word-break: keep-all; max-width: 360px; }
.intro-txt h3 { font-size: 22px }
.intro-txt p { color: #808080; }
.intro .btns-logins .btn { width: 48%; }
.btn-login { margin-left: 5px;  }
.btn:focus, .btn:active { outline: none; }
.btn-disable { background: #dcdcdc; color: #b3b3b3; }
.btn-close { text-align: center; }
.btn-close a { width: 45px; height: 45px; }
.btn-close img { width: 20px; height: 20px; }
.btn-home { height: 24px; margin-top: 5px; }
.btn-home img { height: 100%; }
#header > div > div { }
#header > div > div:last-child { text-align: right; }
#header.signin { height: 53px; padding: 9px 0 0 0; background: none; position: relative; }
#header.signin .ttl { text-align: center; }
#container.signin { padding-top: 0; height: 100%; }
.ttl { text-align: center; color: #003963; }
.p-info { margin: 100px 20px 0; }
.info-input { width: 90%; margin: 0 auto; overflow: hidden; border-radius: 4px; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26); -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26); }
.info-input .form-group { border-top: #e1e1e1 1px solid; margin-bottom: 0; }
.info-input .form-group:last-child { border-bottom: #e1e1e1 1px solid; }
.info-input .form-group input.input-txt { font-size: 16px !important; }
.info-input .checkbox { text-align: center; padding: 0; background: #fff; font-size: 16px; color: #808080 }
.info-input .radio label, .checkbox label { padding-left: 0; }
.terms { padding: 20px; font-size: 10px; color: #666; }
.terms p { margin-bottom: 3px; }
.btns-logins { text-align: center; }
.btns-logins .btn { width: 90%; font-size: 14px; }
#container.login { padding-bottom: 50px; padding-top: 160px; height: 100%; position: relative;     padding-left: 20px; padding-right: 20px;}
.login { width: 80%; margin: 0 auto; }
.login .logo { width: 60%; margin: 0 auto; }
.login .logo img { width: 100%; }
.login-group { overflow: hidden; border-radius: 4px; max-width: 450px;
    margin: 50px auto 0; /*-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26); -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26); */}
.login-group .form-group { font-size: 16px; padding: 0; height: auto; border-bottom: #e1e1e1 1px solid; margin-bottom: 0; }
.login-group .form-control { margin-bottom: 0; border: #dcdddd 1px solid !important; border-radius: 8px; box-shadow: none !important; text-align: center; }
.login-group input.form-control  { border-bottom: none !important; }
.login-group input:first-child.form-control  { border-bottom: none !important; }
.login .imgs,.list .imgs,.forum-info .imgs,.setting .imgs,.member .imgs{ text-align: center;position: absolute; margin-left: -63px;  left: 50%; width: auto; bottom: 20px; background: #fff;}
.login .imgs img,.list .imgs img,.forum-info .imgs img,.setting .imgs img,.member .imgs img{ height: 22px; }
.img-fix {position: relative !important;  bottom: 20px;  margin-top: 30px; width: 100%;     margin-left: 0 !important; left: 0 !important; padding: 30px;}

.login .btns-logins .btn { width: 100%; }

.medical {    max-width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	margin-right: 30px;
	margin-top: 30px;
 }
.medical > img{  }

.mandatory {    max-width: 100%;
	position: absolute;
	bottom: 0;
	margin-bottom: 20px;
 }

#header.page { padding: 19px 0 0 0; border-bottom: #e1e1e1 1px solid; height: 53px; position: fixed; width: 100%; top: 0; z-index: 900; background: #fff; }
#header.page > div > div:last-child { text-align: right; color: #003963; font-size: 14px; }
#header.page > div > div a { color: #003963; font-size: 14px; padding: 0 }
.btn-back { margin-top: 7px; }
.btn-back a { color: #fff; font-size: 14px; padding: 0 }
.btn-back img { height: 14px; margin-right: 5px; margin-top: -2px }
.page-ttl { color: #000; font-weight: normal; font-size: 17px; padding: 4px; text-align: center; }
.confirm-txt { margin-top: 7px; font-size: 12px;}
.btn-make { padding: 18px 15px; margin-top: 10px;}
.btn-make img {  width: 20px; height: 20px; }
.btn-make .btn { font-size: 14px; width: 100%; }
#header.list .page-ttl { text-align: center !important; font-size: 15px !important; margin-top: 2px}
#container.list { padding-bottom: 50px; padding-top: 45px; height: 100%; padding-left: 15px; padding-right: 15px; }
.forum-list { padding: 0 20px }
.forum-box { background-image: url("../images/bg_chart1.png"); background-repeat: no-repeat; background-size: contain; width: 150px; text-align: center; padding:20px; position: relative; height: 194px; margin: 0 auto; }
.forum-box.unlock { background-image: url("../images/bg_chart1.png");  }
.forum-box.lock { background-image: url("../images/bg_chart1_lock.png");  }

.forum-name { height: 105px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; overflow: hidden; word-break: break-all;}
.pro-name { position: absolute; bottom: 35px; width: 100%; left: 0; right: 0; }
.pro-name p { margin-bottom: 1px; }
.hosp { font-size: 10px; }
.intro-txt2 { text-align: center; margin-bottom: 30px; }
.intro-txt2 p { margin-top: 10px; }
#container.forum-info { padding-top: 120px; }
#container.forum-info .forum-box { width: 200px; height: 250px; }
#container.forum-info .pro-name { bottom: 44px; }
#container.forum-info .pro-name .man-name { font-size: 16px; }
#container.forum-info .pro-name .hosp { font-size: 12px; }
#container.forum-info .forum-name { height: 125px; }
#container.forum-info .forum-name textarea { height: 105px; width: 166px; text-align: center; overflow: hidden; padding: 42px 5px; margin-top: 30px; background: none; border: none; font-size: 22px; }
.checked_img { width: 22px; vertical-align: bottom; }
.checkedno { }
#container.forum { padding-bottom: 37px; padding-top: 54px; overflow: hidden; min-height: 100%; }
.forum { background: #f6f7f7 }
.swiper-slide { }
.swiper-slide img { width: 160px; height: 160px; object-fit: cover; }
.article-notice {background: #eee; color: #666; font-size: 12px; padding: 8px;}
.article-li { margin-bottom: 10px; background-color: #fff; overflow: hidden; border-bottom: #f6f6f6 10px solid;}
/*.article-li:last-child { border-bottom: none;}*/

.article-head { clear: both; padding: 10px; }
.article-head > div { float: left; }
.article-head .img-user { width: 35px; height: 35px; }
.article-head .img-user img { width: 100%; }
.article-btns { float: right !important; }
.article-head .user-info { margin-left: 10px; }
.article-head .user-info p { margin: 0; }
.article-head .user-info p:first-child { color: #000; }
.article-content { clear: both; padding: 10px; }
.article-img { clear: both; }
.article-img p:last-child { margin-bottom: 0; }
.article-img > p > img { clear: both; max-width: 100%; }

.important {color: #0071bc; font-weight: bold; text-decoration: underline;}
.btn-im-good { text-align: right; }
.btn-im-good a { margin-left: 10px; }
.btn-im-good img { height: 16px; margin-right: 5px; }
.li-info { padding: 5px; font-size: 11px; overflow: hidden; }
.li-info p{ margin: 0; }
.li-info > div { padding: 0; }
.edit { }
.edit .page-ttl { margin-top: -10px }
.edit .page-ttl p {  }
.edit .page-ttl p:nth-child(2) { font-size: 10px; }
#forum_title { margin-top: 10px; }
#footer-forum-menu { height: 48px; width: 100%; position: fixed; bottom: 0; overflow: hidden; z-index: 998 }
#footer-forum-menu .container{ padding: 13px; background-image: url("../images/bg_footer_menu.png"); background-size: 100%; max-width: 780px; width: 100%;}
#footer-forum-menu span { margin-left: 20px; color: #fff; }
#footer-forum-menu span a { color: #fff; }
#footer-forum-menu span img { max-height: 16px; margin: 0 5px; vertical-align: text-bottom; }
#footer-forum-menu .btn-yellow-small { margin-top: -3px; }
#footer-forum-menu > .container > div { padding: 0 }
#footer-forum-menu > .container > div:first-child { }
#footer-forum-menu > .container > div:last-child { text-align: right; }
.btn-setting img { height: 22px; }
#container.edit textarea { width: 100%; border: none; }
#footer-edit-menu { height: 56px; width: 100%; border-top: #b3b3b3 1px solid; position: fixed; bottom: 0; text-align: center; background-color: #f0f0f0; }
#footer-edit-menu a img { height: 52px }
#header.member .col-xs-2 a { color: #fff; }
#container.member { padding-bottom: 150px; padding-top: 52px;  }
#member-search {padding:10px 15px; position: fixed; background: #fff; z-index: 99;
    border-bottom: #e1e1e1 1px solid; max-width: 780px;}
.member-head { clear: both; }
.member-head > div { float: left; }
.member-head .img-user { width: 50px; height: 50px; }
.member-head .img-user img { width: 100%; }
.member-btns { float: right !important; }
.member-head .user-info { margin-left: 10px; margin-top: 10px; }
.member-head .user-info p { margin: 0; font-size: 10px; }
.member-head .user-info p:first-child { color: #000; font-size: 13px; }
.member-head .user-info span.leader { font-size: 9px; background-color: #999; border-radius: 20px; padding: 1px 5px; color: #fff; }
.member .ttl { font-size: 13px; padding: 5px 24px; background-color: #dcdcdc; text-align: left; color: #666;padding-top: 50px; }
.member_list { border-top: #e4e4e4 1px solid; background: #fff; padding-top: 50px;}
.member_list li { position: relative; border-bottom: #e4e4e4 1px solid; overflow: hidden; padding: 10px; }
.member_list li:active { background-color: #ccc; }
.member-list2 { padding-top: 0; }
.member-btns { width: 20px; height: 18px; background-image: url(../images/btn_member_list.png); background-size: contain; background-repeat: no-repeat; margin-top: 17px; }
#member_select { position: fixed; top: 50%; left: 50%; width: 200px; height: 200px; z-index: 910; margin-top: -100px; margin-left: -100px; text-align: center; }
#member_select > div { position: relative; }
#member_select .img-user { width: 150px; height: 150px; position: relative; margin: 0 auto; }
#member_select .img-user img { height: 100%; }
#member_select .img-user span { width: 27px; height: 27px; position: absolute; bottom: 0; left: 130px; }
#member_select .img-user span img { width: 27px; height: 27px; }
#member_select p { color: #fff; margin: 0 }
#member_select .user-name { font-size: 20px; }
#member_select .hosp { font-size: 14px; }
#member_select .phone-number { font-size: 20px; color: #fff; }
#member_select p.leader { background-color: #999; padding: 0 4px; border-radius: 20px; position: absolute; font-size: 9px; left: 16%; top: 6px; }
#dim .btn-close { position: absolute; top: 38px; right: 30px; background: rgba(255, 255, 255, 0.3); border-radius: 30px; width: 24px; height: 24px; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; -webkit-box-shadow: 0px 0px 38px -5px rgba(0, 0, 0, 0.75); -moz-box-shadow: 0px 0px 38px -5px rgba(0, 0, 0, 0.75); box-shadow: 0px 0px 38px 11px rgba(0, 0, 0, 0.75); }
#dim .btn-close img { width: 61%; object-fit: contain; }
#modal.member { bottom: 40%; top: auto; }
.member_invite .list-check { position: absolute; right: 10px; top: 24px; width: 22px; height: 22px; background-image: url("../images/img_checked_no.png"); background-size: cover; }
.member_invite .list-checked { background-image: url("../images/img_checked.png"); }
#container.write { height: 100%; background: #fff; }
#container.write .article-li { margin: 0; height: 100%; }
#container.write textarea { width: 100%; }
#footer-reply { position: fixed; width: 100%; border-top: #b3b3b3 1px solid; position: fixed; bottom: 0; background-color: #003963;    max-width: 780px; left: 50%; }
#footer-reply input { border-radius: 4px !important; }
#footer-reply > div { padding: 5px; }
#footer-reply button { width: 100%; }
#footer-reply .form-group { margin: 0 }
#container.view { height: auto; padding-bottom: 0; min-height: auto; }
#container.view .article-li { margin: 0; }
#reply { overflow: hidden; padding-bottom: 100px;     max-width: 780px; position: relative;
    margin: 0 auto; margin-top: -10px; background: #fff;}
.reply-status { border-top: #ccc 1px solid; border-bottom: #ccc 1px solid }
.reply-li { background-color: #f0f0f0; }
.reply-li li { border-bottom: #ccc 1px solid; overflow: hidden; }
.reply-head { clear: both; padding: 10px; overflow: hidden; }
.reply-head > div { float: left; }
.reply-head .img-user { width: 35px; height: 35px; }
.reply-head .img-user img { width: 100%; }
.reply-btns { float: right !important; }
.reply-head .user-info { margin-left: 10px; }
.reply-head .user-info p { margin: 0; font-size: 11px; }
.reply-head .user-info p:first-child { color: #000; font-size: 12px; }
.reply-head .reply-date { position: absolute; right: 5px; font-size: 10px }
.ttl-setting { text-align: left; padding: 17px 20px; overflow: hidden; border-bottom: #e1e1e1 1px solid; }
.ttl-setting h3 { color: #000; font-size: 19px; }
.ttl-setting p { color: #666; font-size: 10px; margin-bottom: 0; }
.setting-menu { font-size: 14px; line-height: 23px; border-top: #ccc 1px solid; }
.setting-menu li { border-bottom: #ccc 1px solid; overflow: hidden; background-color: #fff; }
.setting-menu li a { padding: 10px 5px; width: 100%; display: block; color: #000; }
.setting-menu li:active { background-color: #eee; }
.setting-menu li div.arrow-right { margin-top: 10px; background-image: url("../images/btn_member_list.png"); background-size: 8px auto; background-repeat: no-repeat; background-position: center right 10px; height: 20px; }
.push .setting-menu li { padding: 10px 5px; }
.setting-menu .ico-push { background-size: contain; height: 26px; background-image: url("../images/ico_off.png"); background-repeat: no-repeat; }
.setting-menu .ico-push.list-on { background-image: url("../images/ico_on.png"); background-repeat: no-repeat; }
.member-info-photo { padding: 35px; text-align: center; }
.member-info-photo .img-user { width: 147px; margin: 0 auto; position: relative; }
.img-cam { width: 45px; height: 45px; position: absolute; right: 0; top: 100px; }
.img-cam img { width: 45px; height: 45px; }
.myinfo .notice { padding: 10px 23px; }
.myinfo .setting-menu img { max-width: 24px; max-height: 24px; }
.myinfo .setting-menu li { padding: 10px 5px; }
.myinfo .setting-menu > div:first-child { text-align: center; }
.forum.sece { padding-top: 150px !important; }
.sece .ttl { color: #000; font-size: 17px; padding: 20px; text-align: center; }
.sece .info-txt { padding: 50px 20px; background-color: #fff; }
.sece .info-input .checkbox { padding: 0 }
.sece .info-input { width: 90%; margin: 0 auto; background-color: #fff; border-radius: 4px; -webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); -moz-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); }
#confirm { padding: 10px; color: #b3b3b3; overflow: hidden; text-align: center; width: 90%; margin: 0 auto; color: #fff; background-color: #9f9fa0; border: none; border-radius: 4px; -webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); -moz-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;}
#confirm.btn-default { padding: 10px; color: #b3b3b3; overflow: hidden; text-align: center; width: 90%; margin: 0 auto; color: #fff; background-color: #003963; border: none; border-radius: 4px; -webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); -moz-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.26); }

.chk-area { width: 250px; margin: 0 auto; }
.chk-area h5{ text-align: center; }
.chk-label{ margin-top: 10px; padding-left: 20px; background-image: url("../images/img_chk_off.png"); background-size: 18px 18px; background-position: 0px 2px; background-repeat: no-repeat; }
.chk-on {background-image: url("../images/img_chk_on.png");}
.chk-off {background-image: url("../images/img_chk_off.png");}
.chk-label p{ font-size: 11px; margin-bottom: 0 }
.chk-label .ttl{font-size: 14px; text-align: left; font-weight: bold; }
.copyright p{ font-size: 32px; padding: 20px 0; text-align: center; color: #000; }

#search_keyword { border: #ccc 1px solid !important; border-radius: 4px  !important; font-size: 13px;}
a#search  {width:100px; margin-left:5px; padding: 4px 15px; border-radius: 4px; border: #ccc 1px solid; font-size: 13px; border-radius: 4px; border-left: 1px;}
#search  {font-size: 13px; border-radius: 4px; border-left: 1px solid #ccc;}



/* mobile (portrait) ----------- */
@media only screen
and (max-width:320px) {

	/* Smartphones (portrait) ----------- */
	.intro_txt h3 { font-size: 19px; }
	.forum-box { width: 128px; padding: 10px; height: 180px; }
	.forum-name { height: 93px; font-size: 13px; }
	.pro-name { bottom: 42px; }
	.copyright p{ font-size: 16px;  }

}
@media only screen
and (min-width:1px)
and (max-width:640px) {

	.copyright p{ font-size: 22px;  }
	#header #container { width: 100%; }
	#container { width: 100% }

	#header {
		margin-left: 0;
	    left: 0;
	}
}
@media only screen
and (min-device-width:768px)
and (max-device-width:1024px)
and (orientation:portrait) {

/* iPads (portrait) ----------- */ }
@media only screen
and (min-width:1200px) {

/* Desktops and laptops ----------- */ }
@media only screen
and (min-width:1700px) {

/* Large screens ----------- */ }
@media
only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-device-pixel-ratio:1.5) {

/* iPhone 4 ----------- */ }

/*----------modal-----------------------*/
#modal h4 { margin: 0; font-family: arial; color: rgb(21, 92, 161); }
#modal { text-align: center; padding: 0px; width: 210px; border-radius: 10px; background: #e8e8e8; animation-duration: .5s; animation-name: popin; margin: 50px auto auto; opacity: 1; background-color: #fff; overflow: hidden; position: fixed; top: 100px; left: 0; right: 0; z-index: 999; }
#modal .cont { padding: 20px; }
#modal p { margin-bottom: 0; }
@keyframes popin {
	from { margin: 100px auto auto; opacity: 0; }
	to { margin: 50px auto auto; }
}
.buttons { border-top: 1px solid gray; display: inline-block; color: #0071bc !important; width: 50%; padding: 15px 0; font-family: arial; cursor: pointer; box-sizing: border-box; }
.left { float: left; border-right: 1px solid gray; border-bottom-left-radius: 10px; }
.right { float: right; border-bottom-right-radius: 10px; }
.one { width: 100%; }
#dim { background-color: #002755; opacity: .95; height: 100%; width: 100%; z-index: 901; top: 0; left: 0; right: 0; bottom: 0; position: fixed; }
#dim.blk { background-color: #000; opacity: .5; }
#modal.modal-photo { top: 200px; background: none; }
#modal.modal-photo .buttons { width: 100%; padding: 10px; background-color: #fff; }
#modal.modal-photo .buttons:first-child { border-top: none; }
#modal.modal-photo .buttons:active { opacity: .7 }
#modal.modal-agree { width: 300px; }
