@charset "utf-8";

/* layout
============================================== */
body {padding-top: 58px;position: relative;}
p {font-size: 1.5rem;color: #444;line-height: 1.5;}

#header {position: fixed;height: 58px;padding: 0;}
#header h1 {position: absolute;left: 2%;top: 20%;padding: 0;float: none;}
.head-icon {position: absolute;right: 1%;top: 30%;}
.head-icon li {display: inline-block;}
.head-icon li i.fa {color: #FFF;font-size: 2.2rem;}
.head-info {position: relative;}
.icon-info {position: absolute;right: -3px;top: -3px;background-color: #f00;color: #FFF;-webkit-border-radius: 50%;border-radius: 50%;font-size: 1rem;z-index: 2;text-align: center;padding-top: 4px;width: 18px;height: 18px;}
.dropdown-toggle {padding-left: 3px;}
.dropdown-menu {left: auto;right: 0;}
.dropdown-menu li {display: block;}

/*トグルスイッチ*/
.onoffswitch-box {margin: 10px auto 0;width: 180px;overflow: hidden;}
.onoffswitch-box .oneteam-switch {float: left;padding: 7px 5px 0;font-size: 1.5rem;font-weight: bold;}
.onoffswitch-box .oneteam-switch.on {color: #FEED55;}
.onoffswitch {
float: left;
position: relative; width: 70px;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
margin-bottom: 0;
display: block; overflow: hidden; cursor: pointer;
height: 35px; padding: 0; line-height: 35px;
border: 5px solid #FF7143; border-radius: 35px;
background-color: #FF7143;
transition: background-color 0.3s ease-in;
}
.onoffswitch-label:before {
content: "";
display: block; width: 35px; margin: 0px;
background: #fff;
position: absolute; top: 0; bottom: 0;
right: 35px;
border: 5px solid #FF7143; border-radius: 35px;
transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
background-color: #FF7143;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
border-color: #FF7143;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
right: 0px;
}

/*コンテンツ*/
#content {height: 100%;}

[class^="icon-"], [class*=" icon-"] {font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Meiryo","メイリオ";}

/* parts
============================================== */
.btn {-webkit-border-radius: 20px;border-radius: 20px;padding: 7px;padding: 7px 13px;}
.btn-blue {background-color: #1D89E4;}
.btn-blue:hover {background-color: #1A80D6;}

.btn-org {background-color: #F57C00;}
.btn-org:hover {background-color: #ff9529;}

.back-btn-block {margin: 30px;}
.btn-back {width: 100%;background-color: #78909C;color: #fff;}
.btn-back:hover {background-color: #6e8895;color: #fff;}

.btn-default, .btn-default:hover {background-color: #898989;border: none;color: #FFF;}

a, a:hover, a:visited, a:active {color: #1D89E4;}
.link-more:before {font-family: FontAwesome;content: " \f105";padding-right: 5px;}

.shadow {
padding: 15px;
background-color: #FFF;
-webkit-border-radius: 5px;
border-radius: 5px;
box-shadow: 0 0 3px 0 #ccc;
-webkit-box-shadow: 0 0 3px 0 #ccc;
-moz-box-shadow: 0 0 3px 0 #ccc;}

.modal-title {font-size: 1.8rem;}
.page-name {font-size: 1.5rem;font-weight: bold;}
.color-red {color: #F00;font-size: 1.3rem;}

/* login
============================================== */
/*タブレット以下の時*/
@media only screen and (max-width : 767px) {
.loginPanel {width: 90%;height: 300px;}
.panel-body {text-align: center;}
}


/* top
============================================== */
.index-menu {height: 100%;position: relative;}
.top-link {height: 50%;position: relative;}
.top-link a {text-align: center;padding: 20px;display: block;height: 100%;}
.top-link h2 {font-size: 30px;font-weight: bold;}
.top-link .lead {margin: 15px 0 5px;font-size: 16px;}
.top-link .top-link-box {width: 300px;height: 100px;position: absolute;top: 0;right: 0;bottom: 0;left: 0;margin: auto;}
.top-link.top-team .top-link-box {padding-top: 10px;}
.top-link.top-one p {color: #FFF;}
.top-link.top-team p {color: #286BCC;}
.top-link.top-one a {color: #FFF;background-color: #286BCC;}
.top-link.top-team a {color: #286BCC;background-color: #A9C4EB;}

.top-user-img {position: absolute;width: 130px;height: 130px;top: 0;right: 0;bottom: 0;left: 0;margin: auto;}
.top-user-img span {}
.top-user-img img {max-width: 100%;}

.mblock > .conts.info a:first-child {border-top: none;}
.mblock > .conts.info a {border-top: 1px solid #ccc;}

/*iPhone 4s */
@media only screen and (max-width : 320px) {
	.top-link a {padding: 0;}
	.top-link.top-one .top-link-box {top: -30px;}
	.top-link.top-team .top-link-box {bottom: -40px;}
	.top-link h2 {font-size: 25px;}
	.top-link .lead {font-size: 15px;margin-top: 10px;}
}

/* ones top
============================================== */
.prof-block {padding-top: 15px;background-color: #fff;border-bottom: 1px solid #eee;}
.user-img img {width: 100%;-webkit-border-radius: 5px;border-radius: 5px;}
.user-img-w {position: relative;margin-bottom: 15px;display: block;}
.user-img .icon-img-change {position: absolute;z-index: 2;bottom: 0;right: 8px;background-color: #EB6100;-webkit-border-radius: 50%;border-radius: 50%;color: #fff;padding: 10px;margin-bottom: 15px;}
.user-data {padding-top: 10px;}
.user-data .sec-name {font-weight: bold;margin-bottom: 10px;color: #000;}
.user-data .name {font-size: 2rem;font-weight: bold;margin-bottom: 5px;color: #000;}

.prof-bottom dt {padding-top: 10px;font-weight: bold;font-size: 1.4rem;margin-bottom: 5px;}
.prof-bottom dd {padding-bottom: 10px;border-bottom: 1px solid #eee;}
.prof-bottom dd:last-child {border-bottom: none;}

.prof-add {margin: 15px 10px;text-align: center;}
.prof-add .btn {width: 70%;}
.input-prof {margin-top: 15px;}

.ttl-prof {text-align: center;font-weight: bold;font-size: 1.4rem;margin: 20px 0;}
.ttl-prof span {display: block;margin-top: 5px;}
.prof-list-detail {margin-bottom: 20px;}
.prof-list-detail .panel-body {text-align: left;}
.prof-list-detail .panel-body h4 {font-weight: bold;color: #000;font-size: 1.5rem;margin-bottom: 5px;}
.prof-list-detail .panel-body .small {color: #717171;}
.prof-list-detail .panel-body .text {padding-top: 10px;}
.prof-list-detail .panel-footer {background-color: #FFF;padding: 0 10px;}

.good-block {margin: 0;}
.good-block li {padding: 0;margin-right: 5px;}
.good-block li:last-child {}
.good-block li a {display: block;font-size: 1.3rem;padding: 15px 0;}
.edit-btn {float: right;padding: 10px 0;margin: 0;}
.edit-btn li {padding: 0;}
.edit-btn .btn {padding: 4px 13px;font-size: 1.2rem;}

/* teams top
============================================== */
.teams-index {}
.ttl-block {margin-top: 20px;margin-bottom: 10px;}
.ttl-block .page-name {float: left;}
.ttl-block .link-more {float: right;}

.user-list {overflow: hidden;margin-right: -8px;}
.user-list li {float: left;width: 22%;margin-right: 8px;margin-bottom: 10px;}
.user-list .user-list-g {}
.user-list .user-img-w {margin-bottom: 10px;}
.user-list .user-img-w img {}
.user-list .icon-smile {position: absolute;right: -2px;bottom: -5px;}
.user-list .user-name {display: block;text-align: center;font-size: 1.2rem;color: #444;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.user-list .user-up-date {font-size: 1.1rem;color: #888;display: block;text-align: center;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

.team-newup {margin-bottom: 30px;}

.team-new-act {margin-bottom: 30px;}
.team-new-act li {margin-bottom: 10px;position: relative;}
.team-new-act li:after {font-family: FontAwesome;content: " \f105";position: absolute;top: 40%;right: 3%;font-size: 1.8rem;}
.team-new-act li a {display: block;}
.team-new-act li .user-img-w {width: 20%;float: left;margin-bottom: 0;}
.team-new-act li .icon-smile {position: absolute;right: 0;bottom: 0;}
.team-new-act li .team-new-act-detail {float: right;width: 75%;padding-right: 5%;}
.team-new-act li .team-new-act-detail .data {color: #555;font-size: 1.2rem;}
.team-new-act li .team-new-act-detail .text {color: #000;}

/* like comment
============================================== */
.good-block li a {}
.good-block li a.current {color: #FF7143;}
.good-block li a:before {font-family: FontAwesome;content: " \f105 ";margin-right: 5px;}
.good-block li a.current:before {font-family: FontAwesome;content: " \f107 ";margin-right: 5px;}

.comment-block {}
.comment-block {margin-bottom: 30px;}
.comment-block li {margin-bottom: 10px;display: block;}
.comment-block li .comment-user-img-w {width: 20%;float: left;margin-bottom: 0;position: static;}
.comment-block li .comment-user-img {position: relative;}
.comment-block li .icon-smile {right: 0;bottom: 0;position: absolute;}
.comment-block li .comment-user-name {font-size: 1.1rem;margin-top: 5px;text-align: center;}
.comment-block li .comment-block-detail {float: right;width: 73%;}
.comment-block li .comment-block-detail .data {color: #555;font-size: 1.2rem;text-align: right;}
.comment-block li .comment-block-detail .text {color: #000;padding-top: 10px;}
.comment-block li .edit-btn {padding-bottom: 0;}
.comment-block li .edit-btn li {display: inline-block;margin: 0;}

.team-user-block {}
.team-user-block .team-user-img {width: 30%;float: left;}
.team-user-block .team-user-info {width: 65%;float: right;}
.team-user-block .user-name {margin-bottom: 5px;}

/* team-sub
============================================== */
/*最近更新されたプロフィール*/
.team-updates .user-list li {width: 30%;}
.team-updates .user-list li.updates-ttl {float: none;width: 100%;}
.team-updates .ttl-block {padding: 10px 15px 0;border-top: 1px solid #ccc;margin: 0 0 10px -15px;}
.team-updates-ttl {font-weight: bold;color: #000;float: left;}
.team-updates-date {float: right;}

/*最近のできごと*/
.teams-recently .team-new-act li .icon-new {position: absolute;z-index: 2;top: -5px;left: -3px;color: #FFF;background-color: #F00;-webkit-border-radius: 50%;border-radius: 50%;text-align: center;padding: 11px 5px;font-size: 1.1rem;}

/* デスクトップ時のアイコンサイズ
============================================== */
@media only screen and (min-width : 1024px) {
.user-list li {width: 18%;}
.team-new-act li .user-img-w, .comment-block li .comment-user-img-w {width: 10%;}
.team-new-act li .team-new-act-detail, .comment-block li .comment-block-detail {width: 85%;}
.team-updates .user-list li {width: 18%;}
}

/* form
============================================== */
.ttl-blue {color: #1D89E4;font-weight: bold;margin-bottom: 5px;}
.select2-container {width: 100% !important;}
ul.tagit li.tagit-choice {border: none !important;background-color: #00B099 !important;background-image: none !important;}
ul.tagit li .tagit-label, .ui-icon .ui-icon-close {color: #FFF !important;font-weight: bold;}
.ui-state-default .ui-icon {background-image: url("/css/images/ui-icons_222222_256x240.png") !important;}

.help-block {margin-bottom: 0;}
/*.selectView{position: relative;padding: 0;cursor: pointer; overflow: hidden; clear: both;}
.selectView::after{content: " \f0d7";display: block;font-family: FontAwesome;position: absolute;right: 15px;top: 7px;z-index: 0;width: 5px;height: 5px;}
.selectView select{-webkit-appearance: none;-webkit-border-radius: 0;border-radius: 3px;border: 1px solid #CCC;padding: 6px 12px;z-index: 50;background-color: #FFF;}*/

/* add-on
============================================== */
/*
.add-on {position: absolute;bottom: 10px;left: 10px;cursor: pointer;}
.add-on.infoboard {background-color: #FFF;width: 60px;height: 60px;-webkit-border-radius: 50%;border-radius: 50%;text-align: center;padding: 12px 0 0;}
.add-on.infoboard .svg-icon {width: 30px;margin-bottom: 2px;}
.add-on.infoboard span.title {display: block;font-size: 1rem;color: #00253A;}
.add-on.infoboard span.badge-infoboard {position: absolute;right: -3px;top: -3px;background-color: #FA911A;color: #FFF;-webkit-border-radius: 50%;border-radius: 50%;font-size: 1rem;z-index: 2;text-align: center;padding-top: 2px;width: 18px;height: 18px;}
*/
/* 2018/08/15 new add-on
============================================== */
.mt-links {position: absolute;bottom: 10px;left: 10px; display: flex; flex-wrap: wrap-reverse;}
.mt-links .add-on {cursor: pointer; margin-top: 5px; margin-right: 10px;background-color: #FFF !important;width: 60px;height: 60px;-webkit-border-radius: 50%;border-radius: 50%;text-align: center;position: relative;}
.mt-links .add-on.infoboard {padding: 12px 0 0;}
.mt-links .add-on.infoboard .svg-icon {width: 30px;margin-bottom: 2px;}
.mt-links .add-on.infoboard span.title {display: block;font-size: 1rem;color: #00253A;}
.mt-links .add-on.infoboard div.badge-infoboard {position: absolute;right: -3px;top: -3px;background-color: #FA911A;color: #FFF;-webkit-border-radius: 50%;border-radius: 50%;font-size: 1rem;z-index: 2;text-align: center;padding-top: 2px;width: 18px;height: 18px;}
.mt-links .add-on.wanted {padding: 8px 0 0;}
.mt-links .add-on.wanted .svg-icon {width: 27px;margin-bottom: 3px;margin-left: -4px;}
.mt-links .add-on.wanted span.title {display: block;font-size: 1rem;color: #00253A;}
.mt-links .add-on.wanted div.badge-infoboard {position: absolute;top: 0px;right: 0px;background-color: #FA911A;color: #FFF;-webkit-border-radius: 50%;border-radius: 50%;font-size: 1rem;z-index: 2;text-align: center;padding-top: 2px;width: 18px;height: 18px;}

.wanted-info-type-list .num-icon{float: right; margin-right: 15px; background-color: #FA911A; color: #FFF; -webkit-border-radius: 50%; border-radius: 50%; width: 20px; height: 20px; font-size: 1rem; text-align: center; padding-top: 2px;}
.wanted-info-type-list li p{cursor: pointer;padding-left: 5px;}
.wanted-info-type-list li p:hover{background-color: #ffa;}

/* ranking TeamTop
============================================== */
.rank-num{
	position: absolute;
	background-color: #eee;
	color: #4e4e4e;
	width: 26px;
	height: 25px;
	font-size: 1.2em;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	border: solid 2px #eee;
	opacity: 0.8;
}
.rank-top{color: #fff;width: 26px;height: 25px;text-shadow: -1px 0px 1px #000000;}
.rank-num1{background-color: #c7b84a;border: outset 1px #ffee6f;}
.rank-num2{background-color: #a9a9a9;border: outset 1px #d2d2d2;}
.rank-num3{background-color: #c39d56;border: outset 1px #eccb8c;}

/* ranking 
============================================== */
.ranking .rank{width:120px !important;text-align: center;}
.ranking .fs-1{font-size:40px !important;}
.ranking .fs-2{font-size:35px !important;}
.ranking .fs-3{font-size:33px !important;}
.ranking .fs-4{font-size:28px !important;}
.ranking .fs-5{font-size:22px !important;}
.ranking a{display: flex !important; align-items: center;padding: 15px 15px 15px 0;}
.ranking .rank-nottop{color:#909090; font-weight:bold; font-size:22px;}
.ranking .user-name{color:#444; font-size:18px;}
.ranking .point{color:#00BFFF; font-weight:bold; font-size:22px; text-align: right;}
.ranking .company{margin: 1px 0; font-size: 0.9em; color: #555;}
.rank-detail{margin-left: 10px;}
@media (min-width: 560px){
	.ranking .user-name{font-size:22px;}
	.point{font-size:27px;}
}
@media (min-width: 768px){
	.ranking .user-name{font-size:21px;}
	.point{font-size:25px;}
}
.rank-top1{border: medium solid #dcbd39;}
.rank-top2{border: medium solid #abc2cb;}
.rank-top3{border: medium solid #d1955f;}

.authuser-rank {margin: 30px 0;padding: 20px 10px 15px;background-color: #fff;display: flex !important;align-items: center;-webkit-justify-content: space-between; /* Safari */ justify-content:         space-between;}
.authuser-rank p{font-size: 21px;}
.authuser-rank .point{float: right;    color: #00BFFF;font-weight: bold;}
.authuser-rank .rank{font-weight: bold;font-size: 25px;}
.authuser-rank .you-text {font-size: 15px;}
@media (min-width: 560px){
	.authuser-rank {padding: 20px 20px 15px;}
	.authuser-rank .you-text {font-size: 21px;}
}


/* add-on
============================================== */
.recruit-on2 {position: sticky;display: inline-block;}
.recruit-on2.wanted {background-color: #FFF;width: 60px;height: 60px;-webkit-border-radius: 50%;border-radius: 50%;text-align: center; padding: 10px 0 0; border: solid 1px #9fb5c1; cursor: pointer;}
.recruit-on2.wanted .svg-icon {width: 30px;margin-bottom: 2px;}
.recruit-on2.wanted span.title {display: block;font-size: 1rem;color: #00253A;}
.recruit-on2.wanted span.badge-infoboard {position: absolute;right: -3px;top: -3px;background-color: #FA911A;color: #FFF;-webkit-border-radius: 50%;border-radius: 50%;font-size: 1rem;z-index: 2;text-align: center;padding-top: 2px;width: 18px;height: 18px;}

