@charset "UTF-8";
/********************************************************************************************************
CSS 構成書

 File Name:      user.css
 Style Info:     ユーザーページ共通CSS
 Author:         man'age
 Create Modified:2016.06.02
********************************************************************************************************/
/*==========================================================
1.Basic -基本設定-
==========================================================*/
/*==========================================================
2.Layout -基本レイアウトパーツ設定-

body
 ┣#header
 ┣#container
 ┃　┣#contents 
 ┃　┃ ┣#main
 ┃　┃ ┗.side(#side-left)
 ┃　┗.side(#side-right)
 ┗#footer
==========================================================*/
/* Basic Layout */

#container {
  padding: 20px 10px 30px;
}

#main {
  float: right;
width: 520px;
/*    width: 770px;*/
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.side {
  width: 230px;
}

/* Basic Background */
#header {
  background-image: url(../images/user/header_bg.png);
  background-position: top right;
  background-repeat: no-repeat;
  background-size: auto 100%;
}

#container {
  background: #fff;
  -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

/*********************************************
 HEADER
*********************************************/
#header {
  padding: 20px 0;
  margin-bottom: 30px;
}

/***** site title *****/
.site-title {
  left: 0px;
  vertical-align:middle;
}
.site-title img{
  vertical-align:top;
  margin-top:7px;
  padding-right: 10px;
}
.site-subtitle{
  vertical-align:top;
  margin-top:-45px;
}


#header-nav {
	width: 1040px;
	margin-left: auto;
	margin-right: auto;
}
#header-nav li {
	float: left;
	margin-top: 15px;
	margin-right: 15px;
}
#breadcrumb {
	margin-bottom: 15px;
}
nav .pagination {
	margin: 15px 0;
}
nav .pagination li {
	display: inline;
}
nav .pagination li a {
	padding: 6px 12px;
	border: 1px solid #ddd;
	margin-left: -1px;
	text-decoration: none;
}
nav .pagination .active a {
	background-color: #337ab7;
	color: #fff;
}
nav .pagination .active a:hover {
	background-color: #337ab7;
}
nav .pagination a:hover {
	background-color: #eee;
}
/*********************************************
 CONTENTS [ MAIN ]
*********************************************/
/* post archives */
.post-archives {
  padding: 10px 15px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.post-archives .ttl {
  border-bottom-width: 3px;
  border-bottom-style: solid;
  padding: 2px 5px 3px;
  line-height: 1.0;
}
.post-archives .ttl .scat {
	font-size:12px;
	display: inline-block;
	margin-right: 20px;
}
.post-archives .ttl .scat a {
	color: #666;
	text-decoration: none;
}
.post-archives .ttl .scat:before {
  font-family: 'FontAwesome';
  content: "\f0a9";
  margin: 0 5px 0 0;
}
.post-archives .sttl {
  border-bottom-width: 3px;
  border-bottom-style: solid;
  padding: 2px 5px 3px;
  line-height: 1.0;
}

.post-archives .content {
  padding: 10px 5px;
}
.post-archives .post {
  margin-bottom: 15px;
}
.post-archives .post:last-of-type {
  margin-bottom: 0;
}

/* post */
.post {
  position: relative;
  overflow: hidden;
  letter-spacing: 0.075em;
}

.post-meta {
  margin-bottom: 7px;
}
.post-meta .date {
  font-weight: bold;
  margin-right: 10px;
  vertical-align: middle;
}
.post-archives .cat,
.post-meta .cat {
  vertical-align: middle;
  display: inline-block;

  margin-right: 8px;
  overflow: hidden;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: auto 100%;
	color: #fff;
	font-size: 11px;
	padding: 0px 8px;
	 -moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}
.post-archives .cat {
	padding:3px 10px 1px 10px;
	font-size: 14px;
	margin-right: 10px;
}
#main .post-archives .cat {
	padding:0px 8px;
	font-size: 11px;
}

.post-meta .cat_notification,
.post-archives .cat_notification {
	background-color:#0072b1;
/*  background-image: url(../images/user/cat_notification.png);*/
}
.post-meta .cat_manual,
.post-archives .cat_manual {
	background-color:#0ea624;
/*  background-image: url(../images/user/cat_manual.png);*/
}
.post-meta .cat_material,
.post-archives .cat_material  {
	background-color:#eb6100;
/*  background-image: url(../images/user/cat_material.png);*/
}
.post-meta .cat_information,
.post-archives .cat_information {
	background-color:#bd3b3b;
/*  background-image: url(../images/user/cat_information.png);*/
}
.post-meta .cat_movies,
.post-archives .cat_movies {
	background-color:#656565;
/*  background-image: url(../images/user/cat_movie.png);*/
}

.post-ttl {
  font-weight: normal;
}

/* 個別カラー */
#whats-new {
  background-color: #eef8f9;
}

#important-info {
  background-color: #f9f6ee;
}

#whats-new .ttl {
  border-bottom-color: #097c25;
  font-size:18px;
  font-weight: normal;
  color: #000;
  letter-spacing: .1em;
}
#important-info .ttl {
  border-bottom-color: #eb6100;
  font-size:18px;
  font-weight: normal;
  color: #000;
  letter-spacing: .1em;
}

/* widget (main ver) */
#main .widget {
  margin-bottom: 20px;
}
#main .widget-ttl {
  text-align: left;
  padding-left: 20px;
}
#main .widget-content {
  padding: 15px 20px;
}

#hot-movies .widget-ttl {
  background-color: #1b1b1b;
  font-size:18px;
  font-weight: normal;
  color: #fff;
  letter-spacing: .1em;
}
#market-trend .widget-ttl {
  background-color: #006c56;
  font-size:18px;
  font-weight: normal;
  color: #fff;
  letter-spacing: .1em;
}

.movie_name {
	background-color: #ccc;
	text-align: center;
	width: 147px;
	height: 82px;
	line-height: 82px;
	display: inline-block;
}
#market-trend .widget-content {
	text-align: center;
}
#market-trend .graphWrap.f_left,
#market-trend .graphWrap.f_right {
	float: none;
	display: inline-block;
}
/*********************************************
 CONTENTS [ SIDE LEFT ]
*********************************************/
/* category archives */
.cat-archives .ttl {
  text-align: left;
/*  padding: 10px 24px;*/
  padding: 6px 24px 1px 24px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-size: 18px;
  font-weight: normal;
  color: #fff;
}
.cat-archives .sttl {
  text-align: left;
  padding: 5px 10px 0px 10px;
  border-width: 2px;
  border-style: solid;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: normal;
  color: #222;
  margin: 7px 0 7px 0;
}
.cat-archives .ttl a {
  color: #fff;
  text-decoration: none;
  display: block;
}
.cat-archives .sttl a {
  text-decoration: none;
  display: block;
}
.cat-archives .ttl,
.cat-archives .sttl {
  position: relative;
}
.cat-archives .ttl a:after,
.cat-archives .sttl a:after {
  font-family: 'FontAwesome';
  content: "\f0a9";
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -14px;
}
.cat-archives .sttl a:after {
  font-family: 'FontAwesome';
  content: "\f0a9";
  position: absolute;
  top: 50%;
  right: 5px;
  margin-top: -9px;
  color: #666;
}

.cat-archives .content {
  margin: 15px 10px 20px;
  font-size: 0.923em;
  letter-spacing: 0.075em;
  line-height: 1.3;
}
#side-left .cat-archives {
  margin-bottom: 20px;
}

#notification .ttl {
  background-color: #0072b1;
}
#manual .ttl {
  background-color: #02a219;
}
#material .ttl {
  background-color: #ec680c;
}
#information .ttl {
  background-color: #bd3b3b;
}
#tools .ttl {
  background-color: #754e96;
}

#notification .sttl {
  border-color: #0072b1;
}
#manual .sttl {
  border-color: #02a219;
}
#material .sttl {
  border-color: #ec680c;
}
#information .sttl {
  border-color: #bd3b3b;
}
#tools .sttl {
  border-color: #754e96;
}

#notification.post-archives .ttl {
  border-color: #0072b1;
  background-color: #fff;
  font-size: 20px;
  font-weight: normal;
}
#manual.post-archives .ttl {
  border-color: #02a219;
  background-color: #fff;
  font-size: 20px;
  font-weight: normal;
}
#material.post-archives .ttl {
  border-color: #ec680c;
  background-color: #fff;
  font-size: 20px;
  font-weight: normal;
}
#information.post-archives .ttl {
  border-color: #bd3b3b;
  background-color: #fff;
  font-size: 20px;
  font-weight: normal;
}
#tools .ttl.post-archives {
  border-color: #754e96;
  background-color: #fff;
  font-size: 20px;
  font-weight: normal;
}

#notification ul.linklist li:before {
  color: #0072b1;
}
#manual ul.linklist li:before {
  color: #02a219;
}
#material ul.linklist li:before {
  color: #ec680c;
}
#information ul.linklist li:before {
  color: #bd3b3b;
}
#tools ul.linklist li:before {
  color: #754e96;
}

/*********************************************
 CONTENTS [ SIDE RIGHT ]
*********************************************/
/* widget */
.widget {
  margin-bottom: 10px;
}
#side-right .widget-ttl {
  padding: 15px 20px 10px 20px;
  color: #fff;
  font-size: 18px;
  font-weight: normal
 }
#learning-contents .widget-ttl {
  background-color: #0091b5;
}
#e-learning .widget-ttl {
  background-color: #61718c;
}

/* 学習コンテンツ */
#learning-contents .widget-content {
  background-color: #f5f5f5;
  border: 0 none;
}


.more-info {
	text-align: right;
}
/*********************************************
 FOOTER
*********************************************/
#footer {
  text-align: center;
}
#footer ul{ margin: 10px auto;}

#footer ul.footLink li{
	display: inline-block;
}
#footer ul.footLink li a{
	margin-left: 5px;
}
#footer ul.footLink li:before{
  content: '｜';
}
#footer ul.footLink li:first-child:before{
  content: '';
}
/***** copyright *****/
.copyright {
  text-align: center;
  color: #505050;
  font-size: 0.923em;
  letter-spacing: 0.075em;
}

/*==========================================================
3.Functions -各種パーツ設定-
==========================================================*/
/*********************************************
popup
*********************************************/
#home .mfp-content {
  width: 70%;
  padding: 30px;
  background: #fff;
  -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
#home .mfp-content .post-meta {
  /*.cat{
  	background-image:none;
  	//border:3px solid;
  	//@include border-radius(5px);
  	color:#fff;
  	text-indent:0;
  	width:auto;
  	height:auto;
  	padding:0 5px;
  	font-size:;
  }
  .cat_notification{background-color:$blueColor;}
  .cat_manual{background-color:$greenColor;}
  .cat_material{background-color:$orangeColor;}
  .cat_information{background-color:$redColor;}
  .cat_movies{background-color:#1b1b1b;}*/
}
#home .mfp-content .post-ttl {
  font-size: 1.846em;
  border-bottom: 3px solid #ccc;
  font-weight: bold;
  padding: 0 10px;
}
#home .mfp-content .post-content {
  padding: 20px 10px;
  font-size: 1.15em;
  line-height: 1.75;
}

.post-files {
  margin-top: 20px;
  text-align: center;
}
.post-files .btn {
  margin: 5px;
}
.post-files .btn:before, .post-files .btn:after {
  content: '';
  display: inline-block;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 100% auto;
  margin-top: -0.25em;
}
.post-files .btn:before {
  margin-right: 10px;
  background-image: url(../images/common/ico_dl.png);
  width: 20px;
  height: 20px;
}
.post-files .btn:after {
  margin-left: 10px;
}

.btn_pdf:after {
  background-image: url(../images/common/ico_pdf.png);
  width: 24px;
  height: 24px;
}

.btn_doc:after {
  background-image: url(../images/common/ico_doc.png);
  width: 24px;
  height: 24px;
}

/*********************************************
mark
*********************************************/
.mark {
  display: inline-block;
  color: #fff;
  font-size: 10px;
  letter-spacing: 0.2em;
  line-height: 1.4;
  -moz-border-radius: 0.7em;
  -webkit-border-radius: 0.7em;
  border-radius: 0.7em;
  padding: 0 0.7em 0 0.9em;
  margin-left: 0.5em;
}

.mark_important {
  background-color: #eb6877;
}

/*********************************************
icon
*********************************************/
.ico {
  margin-left: 3px;
}

.ico_pc {
  background-image: url(../images/user/ico_pc.png);
  width: 18px;
  height: 18px;
}

.ico_sp {
  background-image: url(../images/user/ico_sp.png);
  width: 18px;
  height: 18px;
}

.ico_sp_non {
  background-image: url(../images/user/ico_sp_non.png);
  width: 18px;
  height: 18px;
}

.ico_external {
  background-image: url(../images/user/ico_external.png);
  width: 13px;
  height: 19px;
  margin-left: 10px;
  margin-right: -13px;
}

/*********************************************
figure
*********************************************/
/* Graph Wrap */
figure.graphWrap {
  margin: 0 5px;
  text-align: left;
}
figure.graphWrap .caption {
  font-size: 1.23em;
  font-weight: bold;
  margin-bottom: 5px;
}
figure.graphWrap .graph {
  padding: 0 5px;
}

/*********************************************
list
*********************************************/
/* link list */
ul.linklist li {
  padding-left: 20px;
  margin-bottom: 5px;
  position: relative;
}
ul.linklist li:before {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  content: '●';
  font-family: monospace;
  font-size: 10px;
  line-height: 1.6;
  vertical-align: middle;
}

/* banner list */
.bnrlist {
	text-align: center;
}
.bnrlist li {
  display: inline-block;
/*  margin: 0 5px 5px 5px;*/
  margin-bottom: 5px;
  line-height: 0;
}

.bnrlist li a {
  display: block;
}
.bnrlist li input[type="image"] {
	margin: 0;
}

/* thumbnail list */
.thumblist {
  position: relative;
  overflow: hidden;
  margin: -10px -12px;
}
.thumblist li {
  float: left;
  display: block;
  margin: 10px;
  line-height: 1.0;
}

.pcnone {
	display: none;
}

/*********************************************
table
*********************************************/
/*==========================================================
4.Pages -ページ別設定-
==========================================================*/
/*********************************************
4-1.Home -トップページ-
*********************************************/
/*==========================================================
9.Media Queries -タブレット／スマホ用スタイル-
==========================================================*/

/* 640px（760pxに変更）以下用（スマートフォン用）の記述
----------------------------------------------------------*/

@media screen and (max-width: 760px) {
.pcnone {
	display: block;
}
.spnone {
	display: none;
}
body {
background-color: #f2f1ea;
}
#header,
#header .site-title,
#container,
#footer {
  width: 100%;
}
#header-nav {
	width: 100%;
}


/*********************************************
 HEADER
*********************************************/
#header {
  background-image: none;
  border-top: 5px solid #0072b1;
}
#header {
  padding: 15px 0 10px;
  margin-bottom: 20px;
}

#header {
  background-color: #fff;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}


/***** site title *****/
#header h1.site-title {
  left: 0;
  font-size:20px;
  letter-spacing: 0;
  display: inline-block;
  width: 35%;
  margin-right: 10px;
}
#header h1.site-title img{
  width: 100%;
}

.site-subtitle{
  display: inline-block;
  margin-top: 0px;
  width: 30%;
}
.site-subtitle img{
  width: 100%;
}
nav.drawer-nav {
	background-color: #f2f1ea;
}
.drawer-hamburger-icon {
	margin-top: 20px;
}
.drawer-menu {
	background-color: #f2f1ea;
}
.drawer-menu li {
	border-bottom: 1px solid #fff;
	text-align: left;
}
.drawer-menu li a {
	color: #00b5da;
}
.drawer-menu li a.drawer-brand {
	background-color: #0091b5;
	color: #fff;
	font-size: 150%;
}


#contents {
  width: 100%;
  float: none;
}
#side-left {
  float: none;
}
#side-right {
  float: none;
}
#main {
  float: none;
  width: 100%;
}
.side {
  width: 100%;
  margin: 0;
  padding:0;
}
#container {
	padding:0;
	margin:0;
	background: transparent;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}

#home #container {
  background: #fff;
}

/* widget */
.widget {
  margin-bottom: 10px;
}

#learning-contents .widget-ttl {
  background-color: #0091b5;
}
#e-learning .widget-ttl {
  background-color: #61718c;
}

/* 学習コンテンツ */
#learning-contents .widget-content {
  background-color: #fff;
  border: 0 none;
  margin: 0;
  padding: 5px;
}


/* 個別カラー */
#whats-new {
  background-color: #fff;
}

#important-info {
  background-color: #fff;
}

#whats-new .ttl {
  border-bottom: 1px solid #097c25;
}
#important-info .ttl {
  border-bottom: 1px solid  #eb6100;
}

/* タブ */
.tabContainer {
	overflow-x: auto;
}
.tabContainer::-webkit-scrollbar {
	height: 1px;
}
.tabContainer::-webkit-scrollbar-track {
	background: #ccc;
}
.tabContainer::-webkit-scrollbar-thumb {
	background: #097c25;
}
 
.tab{
	display: table;
}
 
.tab__button{
	display: table-cell;
	text-align: center;
	vertical-align: bottom;
	width: auto;
	white-space: nowrap;
}
 
.tab__button.active{
	border-top: none;
	background-color: #097c25;
	color: #fff;
	vertical-align: middle;
}
 
.tab__button a{
	padding: 10px 20px;
	color: #00b5da;
	display: block;
	text-decoration: none;
	font-size: 14px;
	border-right : 1px solid #ccc;
	background-color: #fff;
}
.tab__button.active a{
	color: #fff;
	font-size: 140%;
	margin: 5px auto 0 auto;
	border : none;
	background-color: #097c25;
}
 
.contents__content{
	background-color: #fff;
	text-align: left;
	padding-top: 30px;
}

.contents__content div{
    clear: left;
}
 
.contents__content div a{

}
 
.contents__content div a span{

}
 
.contents__content div a:before{

}

/* banner list */
.bnrlist li {
  display: block;
  float: left;
  margin: 1% 0.5%;
  line-height: 0;
 width: 49%;
}
.bnrlist li:last-child {
  margin-bottom: 0;
}
.bnrlist li img {
 width: 100%;
}
.bnrlist li a {
  display: block;
}
.graphWrap.f_left,
.graphWrap.f_right {
	float: none;
}
/* 各種パーツ */
#home .mfp-content {
  width: 90%;
}


}