@charset "utf-8";
/* CSS Document */

 /*---------------------------------------------------------
 　 　　template
  ==========================================================*/

/*-----------------------
 　 　　header
  ---------------------*/
 @media screen and (min-width: 600px) {
	.header {
	width:100%;
	border-bottom: solid 1px #CCC;
	background-color:#fff;
	border-top:solid 3px #336699;


}
	.header-in {
	width:980px;
	margin:0 auto;
	padding:25px 0 47px 0 ;
	text-align:left;
}


	.header-in:after {
	  display: block;
	  clear: both;
	  content: "";
	}

 	.header-logo {
	display:inline-block;
	 float:left;
	margin-right: 10px;
	}

	.header-logo .item {
		display:table;
		float:left;
		height:55px;
		margin-right:65px;
	}
	.header-logo .logo-main img {
		width:100px;
	}
	.header-logo .logo-sub {
	display:table-cell;
	vertical-align:middle;
	}
	.header-logo .logo-sub img {

		width:100px;
	}

	.btn-contact{
	position:absolute;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #fff;
	font-weight:bold;
	font-size:86%;
	padding: 5px 20px 5px 35px;
	text-decoration:none;
	background:url(../images/parts/mail.png) no-repeat 10% 50% #b51010;
	background-size:18px auto;
	right: 115px;
	top: 35px;
}
	.header-member {
		position:relative;
		width:50%;
		float:right;
	}
 .header-member .box-button a.btn-status
	{
	position:absolute;
	background: #2f2e2e;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #fff;
	font-weight:bold;
	font-size:86%;
	padding: 2px 15px;
	text-decoration:none;
	right:0px;
	top: 0px;

}
			.header-member .box-button a.btn-status.logout { display: none; }
			.header-member.is-logged-in .box-button a.btn-status.login { display: none; }
			.header-member.is-logged-in .box-button a.btn-mypage { display: block; }
			.header-member.is-logged-in .box-button a.btn-status.logout { display: block; }

.header-member .btn-mypage	{
	position:absolute;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #fff;
	font-weight:bold;
	font-size:86%;
	padding: 5px 20px 5px 30px;
	text-decoration:none;
	background:url(../images/parts/person.png) no-repeat 10% 50% #0066cc;
	background-size:14px auto;
	right: 0px;
	top: 35px;
}

.txt-welcome {
	float:right;
	padding:0 20px 0 0;
	margin-right:110px;
}
.txt-welcome .name {
	padding-right:10px;
}
.txt-welcomee name .guest {
	margin-right:5px;
}

 }
 @media screen and (min-width: 600px) and (max-width: 959px){
 	.header-in {
	width:95%;
	box-sizing: border-box;
	margin:0 auto;
	padding:25px 0 47px 0 ;
	text-align:left;
}



}
 @media screen and (min-width: 0px) and ( max-width:599px ) {

	.header {
	border-top: 4px solid #336699;
	border-bottom: 1px solid #ccc;
	background-color: #fff;
}
	.header-in {
		padding: 12px 10px;
		overflow: hidden;
	}
	.header-logo {
		float: left;
		padding-top: 5px;
	}
		.header-logo .item { display: block; width:120px;}
			.header-logo a { display: inline-block; }
			.header-logo a.logo-main { margin-bottom: 20px; }
			.header-logo .item img { max-width: 100%; width: 55px; }
	.header-member { float: right; }
		.header-member .box-button {
			display: flex;
			display: -webkit-flex;
			-webkit-justify-content: flex-end;
			justify-content: flex-end;
			width: 180px;
			margin-bottom: 12px;
			overflow: hidden;
		}
			.header-member .box-button a {
				float: left;
				display: block;
				width: 60px;
				height: 15px;
				padding-top: 25px;
				border: 1px solid transparent;
				font-size: 10px;
				line-height: 1;
				text-align: center;
			}

			.header-member .box-button a.btn-contact {
				background: #b51010 url(../images/parts/ico_contact_sp.png) center 5px no-repeat;
				background-size: 14px 16px;
				color: #fff;
			}



			.header-member .box-button a.btn-mypage {
				display: none;
				background: #336699 url(../images/parts/ico_user_sp.png) center 5px no-repeat;
				background-size: 14px 16px;
				color: #fff;
			}
			.header-member .box-button a.btn-status {
				background: url(../images/parts/ico_locked_sp.png) center 5px no-repeat;
				background-size: 13px 16px;
				border-color: #ccc;
				color: #000;
			}
			.header-member .box-button a.btn-status.logout { display: none; }
			.header-member.is-logged-in .box-button a.btn-status.login { display: none; }
			.header-member.is-logged-in .box-button a.btn-mypage { display: block; }
			.header-member.is-logged-in .box-button a.btn-status.logout { display: block; }

		.txt-welcome {
			font-size: 10px;
			color: #000;
			line-height: 1;
			text-align: right;
		}
			.txt-welcome .name.user { padding-right:10px; }
			.txt-welcome .name { padding-right:10px; }
			.txt-welcome .last_name { padding-right:5px; }
			.txt-welcome .first_name { padding-right:5px; }
			.txt-welcome .guest { padding-right:5px; }
}

/*-----------------------
 　 　　content
  ---------------------*/

 @media screen and (min-width: 600px) and (max-width: 959px){
	#content {
    width: 95%;
	box-sizing: border-box;
    margin:20px auto;
	padding:10px 0;
	min-height:400px;
	}
}
 @media screen and (min-width: 0px) and ( max-width:599px ) {
	#content {
    width: 95%;
	box-sizing: border-box;
    margin:10px auto 20px;
    padding:10px 0;
	min-height:400px;
	font-size:12px;
}
}

/*-----------------------
 　 　　title_Layout
  ---------------------*/

 .Layout{
	 margin:0 auto;
	 padding-bottom:30px;
 }
 .Layout .fc-red {
	 color:#cc3333;
 }
 .Layout .fc-blue {
	 color:#0066cc;
 }
 .Layout .fw-bold {
	 font-weight:bold;
 }

 .Layout p{
	 margin-bottom:10px;
 }

  .Layout h2 {
	  margin-bottom:10px;
	  margin-top:30px;
  }

 .Layout h3 {
	 font-size:136%;
	 font-weight:bold;
	 padding:20px 0;

 }
 .Layout h3:after {
	content: "";
    display: block;
    width: 100%;
    height: 3px;
    background-color: #336699;
    margin: 10px 0 10px;
 }

  .Layout h4 {
	 font-size:115%;
	 font-weight:bold;
	 padding-top:10px;
	 margin-bottom:10px;
	 color:#3e7dbd;
  }


 @media screen and (min-width: 0px) and ( max-width:599px ) {

	.ttl_page {
		margin-bottom: 20px;
	 }

	 .Layout h2 {
	  margin-bottom:10px;
	  margin-top:20px;
  }

   .Layout h3 {
	 font-size:136%;
	 font-weight:bold;
	 padding:10px0;
	 line-height:140%;

 }
 .Layout h3:after {
	content: "";
    display: block;
    width: 100%;
    height: 3px;
    background-color: #336699;
    margin: 5px 0 10px;
 }

  .Layout h4 {
	 font-size:115%;
	 font-weight:bold;
	 margin-bottom:10px;
	 color:#3e7dbd;
  }
 }

/*-----------------------
 　 Table of contents
  ---------------------*/
.toc{
	position: relative;
	width:100%;
	line-height: 160%;
	border:3px solid #ccc;
	padding:30px 20px;
	box-sizing: border-box;
	margin:30px 0 ;
}
.toc h1 {

}
.toc h1 span {
	font-size:100%;
	font-weight:bold;
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 0 10px;
  text-align: left;
}



.toc ol{
	margin:0 auto;
	counter-reset: hl_count;
	list-style: none;
	padding:10px 30px;
}
.toc li{
	counter-increment: hl_count;
	padding:8px 0 6px 0px;
	font-weight:bold;
	border-bottom:1px solid #ccc;
	text-indent:-20px;
	

}
.toc li:before{
	content: counters(hl_count, "-");
	margin-right:10px;
	font-size:115%;
	text-align: center;
	
	
}


@media screen and (min-width: 0px) and ( max-width:599px ) {
	
	.toc{
	position: relative;
	width:100%;
	line-height: 160%;
	border:3px solid #ccc;
	padding:15px 10px;
	box-sizing: border-box;
	margin:30px 0 ;
}
}

/*-----------------------
 　 　　img_Layout
  ---------------------*/
 .Layout .img_Layout {
	 width:100%;
	 overflow: hidden;
	 box-sizing: border-box;
	 margin-bottom:40px;
 }
  .Layout .img_Layout:after {
	 clear: both;
	  content: '';
	  display: block;
}

 .Layout .img_Layout .imgLeft img,
 .Layout .img_Layout .imgRight img {
	  width:98%;
	  height:auto;
  }
  .Layout .img_Layout .imgLeft {
	  float:left;
	  width:30%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .imgRight {
	  float:right;
	   width:30%;
	   padding:0 10px;
	   box-sizing: border-box;
  }
   .Layout .img_Layout .txtLeft p,
  .Layout .img_Layout .txtRight p {
	  margin-bottom:0px;
  }
  .Layout .img_Layout .txtLeft {
	  float:left;
	  width:70%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .txtRight {
	  float:right;
	  width:70%;
	  padding:0 10px;
	  box-sizing: border-box;
  }
@media screen and (min-width: 960px) {
	 .Layout .img_Layout .imgLeft {
	  float:left;
	  width:30%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .imgRight {
	  float:right;
	   width:30%;
	   padding:0 10px;
	   box-sizing: border-box;
  }
  .Layout .img_Layout .txtLeft {
	  float:left;
	  width:70%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .txtRight {
	  float:right;
	  width:70%;
	  padding:0 10px;
	  box-sizing: border-box;
  }
}
 @media screen and (min-width: 600px) and (max-width: 959px){
	.Layout .img_Layout .imgLeft {
	  float:left;
	  width:45%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .imgRight {
	  float:right;
	   width:45%;
	   padding:0 10px;
	   box-sizing: border-box;
  }
  .Layout .img_Layout .txtLeft {
	  float:left;
	  width:55%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .txtRight {
	  float:right;
	  width:55%;
	  padding:0 10px;
	  box-sizing: border-box;
  }
}
 @media screen and (min-width: 0px) and ( max-width:599px ) {
  .Layout .img_Layout .imgLeft {
	  float:none;
	  width:100%;
	  padding:0 10px 20px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .imgRight {
	  float:none;
	   width:100%;
	   padding:0 10px 20px;
	   box-sizing: border-box;
  }

  .Layout .img_Layout .txtLeft {
	 float:none;
	  width:100%;
	  padding:0 10px;
	  box-sizing: border-box;

  }
  .Layout .img_Layout .txtRight {
	  float:none;
	  width:100%;
	  padding:0 10px;
	  box-sizing: border-box;
  }
}



 /*-----------------------
 　 　　img_Full_Layout
  ---------------------*/

  .Layout .img_Full  {
	 width:100%;
	 box-sizing: border-box;
  }
   .Layout .img_Full img {
	   width:100%;
	   height:auto;
   }
/*-----------------------
 　 　　Frame_box
  ---------------------*/

   .Layout .Frame_box {
	   box-sizing: border-box;
	width:98%;
	margin:10px auto 30px;
	border:dashed #999999 1px;
	padding:30px;
}
		.Layout .Frame_box p {
			margin:10px 0;
		}

 @media screen and (min-width: 0px) and ( max-width:599px ) {
.Layout .Frame_box {
	   box-sizing: border-box;
	width:98%;
	margin:10px auto 15px;
	border:dashed #999999 1px;
	padding:20px;
}
		.Layout .Frame_box p {
			margin:10px 0;
		}
}

/*-----------------------
 　 　Listmarker01
  ---------------------*/

.Layout ul.Listmarker01 {
	  width:98%;
	  margin: 10px auto;

 }
  .Layout ul.Listmarker01 li {
	  text-indent:-12px;
	  margin-left:15px;
	  margin-bottom:10px;
  }
   .Layout ul.Listmarker01 li::before {
  	content: '';
    display: inline-block;
    width: 4px;
    height:4px;
    margin-right: 8px;
    background: #3e7dbd;
    border-radius: 100%;
    vertical-align: 2px;

   }
 @media screen and (min-width: 0px) and ( max-width:599px ) {
	 .Layout ul.Listmarker01 {
	  width:98%;
	  margin:0px auto 15px;

 }
 }
/*-----------------------
 　 　　table
  ---------------------*/
@media screen and (min-width: 600px) {
.Layout .table-wrap table{
width:100%;
border-top:1px solid #b2b2b2;
border-right:1px solid #b2b2b2;
margin-bottom:20px;
}
.Layout .table-wrap table th{
	padding:10px;
	font-weight:bold;
	background:#e8eaef;
	border-bottom:1px solid #b2b2b2;
	border-left:1px solid #b2b2b2;
}
.Layout .table-wrap table td{
	padding:10px;
	border-bottom:1px solid #b2b2b2;
	border-left:1px solid #b2b2b2;
}

.Layout .table-wrap table .tw_100 { width:100px;}
.Layout .table-wrap table .tw_150 { width:150px;}
.Layout .table-wrap table .tw_200 { width:200px;}
.Layout .table-wrap table .tw_250 { width:250px;}
.Layout .table-wrap table .tw_300 { width:300px;}

}

 @media screen and (min-width: 0px) and ( max-width:599px ) {
.Layout .table-wrap {
  width: 100%;
  overflow: auto;
  background: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.2)) 0 0/20px 100%, linear-gradient(to right, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.2)) right/20px 100%;
  background-repeat: no-repeat;
  background-attachment: scroll;
  border-right: 1px solid #b2b2b2;
  margin-bottom:20px;
}

.Layout .table-wrap table {
	width:980px;
  background: linear-gradient(to left, rgba(255, 255, 255, 0), white 15px) 0 0/50px 100%, linear-gradient(to right, rgba(255, 255, 255, 0), white 15px) right/50px 100%;
  background-repeat: no-repeat;
  background-attachment: local;
  border-bottom: 1px solid #b2b2b2;
  border-collapse: collapse;
}

.Layout .table-wrap th {
  padding: 10px;
  font-weight:bold;
  background: rgba(28, 53, 95, 0.1);
  border-top: 1px solid #b2b2b2;
  border-left: 1px solid #b2b2b2;
  word-wrap: break-word;
}

.Layout .table-wrap td {
  padding: 10px;
  border-top: 1px solid #b2b2b2;
  border-left: 1px solid #b2b2b2;
  word-wrap: break-word;
}

.Layout .table-wrap table .tw_100 { width:100px;}
.Layout .table-wrap table .tw_150 { width:150px;}
.Layout .table-wrap table .tw_200 { width:200px;}
.Layout .table-wrap table .tw_250 { width:250px;}
.Layout .table-wrap table .tw_300 { width:300px;}
 }

/*-----------------------
 　 　　footer
  ---------------------*/
 @media screen and (min-width: 600px) {
	  .footer_area {
		background: #d3deed;
		padding:20px 0 3px 0;
 }
 	.footer {
		width:980px;
		margin:0 auto;
	}
	.footer-in {
		padding-bottom:6px;
	}
	.footer_logo {
		margin-right:5px;
		}

	.footer-links {
	float:right;
	padding-top:20px;
	}
	ul.footer-links li{
		display: inline-block;
		padding-left:15px;

	}
	ul.footer-links li a{
		font-weight:bold;
		text-decoration:none;
		color:#333;
		font-size:86%;
	}
	ul.footer-links li a:before{
		content:"> " ;

	}
	.footer-copyright {
		clear:both;
	text-align:center;
	background-image:url(../images/parts/footer_bg2.png);
	padding:10px 0;
	font-size:72%;
	color:#fff;
}
	.btn-cmn-pagetop {
		display:none;
	}
 }

 @media screen and (min-width: 600px) and (max-width: 959px){

 .footer {
		width:90%;
		margin:0 auto;
	}


.footer-links {
	width:80%;
	float:right;
	padding-top:0px;
	margin-bottom:20px;
}
.footer-links li{
	display: inline-block;
	width:40%;
	padding-left:5px;

}
.footer-links li a{
	font-weight:bold;
	text-decoration:none;
	color:#333;
	font-size:86%;
}

.btn-cmn-pagetop {
		display:none;
	}


 }

@media screen and (min-width: 0px) and ( max-width:599px ) {

	#footer_area1 {
		display:none;
	}
	#page-top {
		display:none;
	}
	.footer {
}
	.footer-in {
		padding: 15px 10px;
		background-color: #cce0e9;
	}
	.footer_logo {
		display:none;
		}

		.footer-links {
			margin-top: -13px;
			overflow: hidden;
		}
			.footer-links li {
				float: left;
				width: 50%;
				margin-top: 10px;
				line-height:110%;
				box-sizing: border-box;
			}
			.footer-links li:nth-child(even) { padding-left: 10px; }
			.footer-links li a {
					padding-left: 12px;
					background: url(../images/parts/ico-arrow-03_sp.png) 0 center no-repeat;
					background-size: 6px 10px;
					font-size: 10px;
					color: #333;
					text-decoration: none;
				}
	.footer-copyright {
		padding: 8px 10px 9px;
		background-color: #000;
		color: #fff;
		letter-spacing: -0.02em;
		text-align: center;
		font-size:10px;
	}


	/* pagetop --- */
	#page-top {
		display:none;
	}
	#page-top img{
		display:none;
	}

	.btn-cmn-pagetop { background-color: #d8d8d8; }
	.btn-cmn-pagetop a {
		display: block;
		padding-top: 25px;
		padding-bottom:8px;
		background: url(../images/parts/ico-pagetop-01_sp.png) center 10px no-repeat;
		background-size: 15px 9px;
		font-size: 10px;
		color: #000;
		line-height: 1;
		text-align: center;
	}


}
