@charset "utf-8";

@-ms-viewport {
    width: auto;
}

html,body {
    font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}

.form-date, .form-year, .form-month, .form-time {
    width: 150px;
}
.modal-header {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.help-block.error {
    color: red;
}

.form-group.required label.control-label:before {
    content:'*';
    color:red;
    font-weight:bold;
    display:inline-block;
    margin-right: 5px;
}

.table th{
    text-align: center;
    background-image: linear-gradient(to bottom, #337ab7 0px, #265a88 100%);
    color: white;
}
.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
    padding: 4px;
}

.pagination {
    margin: 0;
}

.ime-off {
    ime-mode: disabled;
}

#header {
    border-bottom:3px #337ab7 solid;
}

#footer {
    position: relative;
}
#footer > div {
    height: 50px;
    background-color: #3f6994;
    color: #fff;
}

#footer > #takuchi {
    position: absolute;
    left: 20px;
    bottom: 0;
    padding-bottom: 10px;
}

.pctext {
	    display: block;
}
.tabtext {
	    display: none;
}

.resizeimage img { 
		width: 100%; 
		height: auto; 
}

.resizeimage_icon img { 
		width: 32%; 
		height: auto; 
}

.pageTop {
    position:relative;
    margin:0 auto;
}
.pageTop a {
    position: fixed;
    bottom: 0px;
    display: block;
    right: 20px;
    /* ↓以下はリンク装飾↓ */
    z-index:9999;
}

#pnl_member > .panel-body {
    background-color: #e8f4f4;
}

.pnl_side > .panel-heading {
    font-weight: bold;
    font-size:16px;
}

.menu {
    font-weight: bold;
    font-size:16px;
}

.text_bold {
    font-weight:bold;
    font-size: 18px;
}

.member_sub_header {
    border-top: solid 1px black;
    border-bottom: solid 1px black;
    padding:5px;
}
.member_sub_header > span {
    font-weight:bold;
    font-size: 16px;
    color: #3f6894;
}

.lbl_complete {
    background-color: #337ab7;
    color: #fff;
    border-radius: 4px;
    padding: 2px 5px;
    font-weight: bold;
}

.lbl_during {
    background-color: #d9534f;
    color: #fff;
    border-radius: 4px;
    padding: 2px 5px;
    font-weight: bold;
}

.adbr_exp {
    font-size: 75%;
}

/*動画一覧表示*/
.content {
    position: relative;
    font-size: 22px;
}
.content.start {
    border: red solid 3px;
}
.content img {
    width:100%;
}
.content-play {
    position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}
.content-play .inner {
    position: relative;
    top: 40%;
}
.content-play .inner .play {
    width: 64px;
}
.content-play:hover {
    opacity: 0.5;
}
.content-inner {
    color:#fff;
    background-color:#000;
    position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    text-align: center;
    vertical-align: middle;
}
.content-inner p {
    position: relative;
    top: 40%;
}
.content-time {
    color:#fff;
    background-color:#000;
    position:absolute;
    bottom: 0;
    right: 0;
    height: 24px;
    line-height: 24px;
    font-size: 20px;
    text-align: center;
    opacity: 0.8;
    padding: 0 5px;
}

/*詳細文省略表示*/
.lineclamp {
    height: 3em;
    background-color: #fff;
    position: relative;
    padding-right: 1em;
    overflow: hidden;
}
.lineclamp:before {
    content: "...";
    position: absolute;
    right: 0;
    bottom: 0;
    display: inline-block;
    width: 1em;
}
.lineclamp:after {
    content: "";
    position: relative;
    right: -1em;
    float: right;
    width: 1em;
    height: 100%;
    background-color: inherit;
}

#tbl_notice tr {
    height: 50px;
}

#tbl_notice td {
    vertical-align: middle;
}

/*研修内容*/
.item_movie {
    padding: 5px 15px 5px 24px;
}
.item_test {
    padding: 5px 15px 5px 40px;
    border-top: 0 none;
}
.list-group-item.item_select {
    padding-left: 5px;
    background-color: #ffe2b9;
}
.list-group-item.item_select:hover {
    background-color: #eee2b9;
}
.item_test > .select_icon {
    padding-right: 20px;
}

/*動画表示*/
.content_show {
    font-size: 18px;
}
.content_movie {
    position: relative;
    width: 80%;
    /*max-width: 640px;*/
}
.hatochi_msg {
    background-color:#f1eee9;
    color:#a32c32;
    width:75%;
    padding:20px;
    margin-left:20px;
}
.movie_detail {
    border: #e1e4e9 solid 3px;
    padding: 20px;
}
.movie_detail span.detail_header {
    border-bottom: #337ab7 solid 3px;
}

.breadcrumb > li + li:before {
  content: ">";
}

.showmovie_setumei {
	font-size: 18px;
}

.showmovie_title {
	font-size: 18px;
}

.movie_control_btn {
	font-size: 14px;
	padding: 6px 12px;
}

.attachfile_bottom {
	margin-bottom:0px;
}

.movie_siryo_setumei {
	font-size: 18px;
}

.movie_siryo_ml {
	margin-left: 20px;
}

.movie_siryo_detail {
    width : 75%;
	margin-left: 20px;
	font-size: 18px;
}

.list_title_bottom {
	margin-bottom:0px;
}

.list_btn_bottom {
	margin-bottom:0px;
}

.ank_btn_bar {
	margin-top:450px;
}

.ank_btn_mrg {
	margin-left:20px;
}

.ank_btn_width {
	width:205px;
}

.ank_setumei_width {
	width:75%;
	margin-left:20px;
}

.finish_setumei_bar {
	margin-bottom:0px;
}
	
@media screen and (max-width:980px) {
	.pctext {
	    display: none;
	}
	.tabtext {
	    display: block;
	}
	
	.showmovie_setumei {
		font-size: 16px;
	}
	
	.showmovie_title {
		font-size: 16px;
	}
	
	.movie_control_btn {
		font-size: 12px;
		padding: 6px 9px;
	}
	
	.attachfile_bottom {
		margin-bottom:10px;
	}
	
	.movie_siryo_setumei {
		font-size: 18px;
	}
	
	.movie_siryo_ml {
		margin-left: 0px;
	}
	
	.movie_siryo_detail {
    	width : 100%;
		margin-left: 0px;
		font-size: 16px;
	}
	
	.list_title_bottom {
		margin-bottom:15px;
	}
	
	.list_btn_bottom {
		margin-bottom:20px;
	}
	
	.ank_btn_bar {
		margin-top:50px;
	}
	
	.ank_btn_mrg {
		margin-left:0px;
	}
	
	.ank_btn_width {
		width:300px;
	}
	
	.ank_setumei_width {
		width:310px;
		margin-left:0px;
	}
	
	.finish_setumei_bar {
		margin-bottom:10px;
	}

	.content_movie {
    position: relative;
    width: 100%;
    /*max-width: 640px;*/
}
}

/* ----------------------------------------------------

    margin

---------------------------------------------------- */

.mt00 { margin-top:  0px !important; }
.mt05 { margin-top:  5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }

.mr00 { margin-right:  0px !important; }
.mr05 { margin-right:  5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }

.mb00 { margin-bottom:  0px !important; }
.mb05 { margin-bottom:  5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb90 { margin-bottom: 90px !important; }

.ml00 { margin-left:  0px !important; }
.ml05 { margin-left:  5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }

/* ----------------------------------------------------

    padding

---------------------------------------------------- */

.pt00 { padding-top:  0px !important; }
.pt05 { padding-top:  5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt25 { padding-top: 25px !important; }
.pt30 { padding-top: 30px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }

.pr00 { padding-right:  0px !important; }
.pr05 { padding-right:  5px !important; }
.pr10 { padding-right: 10px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }

.pb00 { padding-bottom:  0px !important; }
.pb05 { padding-bottom:  5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }

.pl00 { padding-left:  0px !important; }
.pl05 { padding-left:  5px !important; }
.pl10 { padding-left: 10px !important; }
.pl15 { padding-left: 15px !important; }
.pl20 { padding-left: 20px !important; }
.pl25 { padding-left: 25px !important; }
.pl30 { padding-left: 30px !important; }
.pl35 { padding-left: 35px !important; }
.pl40 { padding-left: 40px !important; }