@charset "utf-8";


/*リセット*/
/*行の高さをフォントサイズと同じにして余白をリセットしています
（※padding:0;は省略しても違いが見られなかったためmargin:0;のみ）*/
body {
    line-height:1;
    margin:0;
}
 
/*ブロックレベル要素の余白をリセットしています
（※padding:0;は省略しても違いが見られなかったためmargin:0;のみ）*/
h1, h2, h3, h4, h5, h6, p {
    margin: 0;
}
 
/*HTML5での新規追加要素のデフォルトをブロック要素へ変更しています
（※Android2.1以前のブラウザではインライン要素となっているようでした）*/
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}
 
/*水平罫線のデフォルトである立体的な罫線を見えなくしています
（※罫線の色を変える場合は#ccccccの部分を変更）*/
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
 
/*リスト要素のリストスタイルと余白をリセットする
（※margin:0;は省略しても違いが見られなかったためpadding:0;のみ）*/
ul {
    list-style:none;
    padding:0;
}
li {
	list-style:none;
    padding:0;
}
 
/*縦方向の揃え位置を中央揃えに指定しています*/
input, select {
    vertical-align:middle;
}
.container {
	width: 100%;
}
.img_100{
	margin:0px;
}
img{
	width: 100%;
	height: auto;
}
.bold {
	font-weight: bold;
}
.red {
	color: red;
}	

/*全体テキストカラー*/
.bl {
	color: #303030;
}	


.caption {
	background: #ccc;
	font-size: 14px;
	text-align: center;
	padding: 3%;
	margin: 0 3%;
}
.f_clear{
	clear:both;
	margin:0px;
	padding:0px;
	font-size:1px;
	line-height:0px;
	background-color:transparent;
}

p {
	line-height: 150%;
	margin: 3% 3% 0;
}
p + h3 {
	padding: 3%;
}
/*strongテキストカラー*/
strong {
	font-weight: bold;
	color: #303030;
}
em {
	text-decoration: underline;
	background: #FF6;
	font-style: normal;
}
small {
	font-size: 70%;
}
.l-100 {
	line-height: 100%;
}
.pull-left {
  float: left;
  display: inline;
}
.pull-right {
  float: right ;
  display: inline;
}
.text-left {
	text-align:left;
}
.text-center {
	text-align:center;
}
.text-right {
	text-align:right;
}
/* Clearfix */
.clearfix:before, .clearfix:after{content:""; display:table;}
.clearfix:after{clear:both;}
.clearfix{zoom:1;}

.list-style li {
	list-style: disc;
}
ul.list-style {
	margin-left: 30px;
	font-weight: bold;
}

.scroll + a {
	background: #f3f3f3 url(../img/under.png) no-repeat center 50px;
	width: 100%;
	text-align: center;
	font-size: 0.9rem;
	height: 80px;
	line-height: 60px;
	position: relative;
}


/*
----------------------------------------------
 マージンの設定
----------------------------------------------
*/
.m3{margin: 3%;}
.mt3{margin-top: 3%;}
.ml3{margin-left: 3%;}
.mr3{margin-right: 3%;}
.mb3{margin-bottom: 3%;}

.m5{margin: 5%;}
.mt5{margin-top: 5%;}
.ml5{margin-left: 5%;}
.mr5{margin-right: 5%;}
.mb5{margin-bottom: 5%;}

/*
----------------------------------------------
 横幅の設定
----------------------------------------------
*/
.col-12 {width: 100%;}
.col-11 {width: 91.663%;}
.col-10 {width: 83.33%;}
.col-9 {width: 75%;}
.col-8 {width: 66.664%;}
.col-7 {width: 58.331%;}
.col-6 {width:  50%;}
.col-5 {width: 41.665%;}
.col-4 {width: 33.332%;}
.col-3 {width: 25%;}
.col-2 {width: 16.666%;}
.col-1 {width:  8.333%;}


header {
	position: relative;
}  


/*ヘッダ動かす場合
----------------------------------------------
header {
    z-index: 101;
    position: fixed !important;  
    position: absolute;  
    top: 0;  
    left: 0;  
    width: 100%;  
    background-color: #FFF;  
    color: #fff;  
}  
----------------------------------------------
*/
.menu {
	width: 10%;
	height: auto;
	position: absolute;
	right: 3%;
	top: 20%;
}
.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}

.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: #fff;
	border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 20px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}
.js-menu {
	display: none;
	
  	width: 100%;
	background: #000;
}
.js-menu li a {
	padding: 3%;
	border-bottom: 1px solid #ccc;
	width: 100%;
	display: block;
	text-align: center;
	font-size: 70%;
}

/* 目次 */
.contents-wrap {
	background: #f8f5db;
	padding: 3%;
	position: relative;
	margin: 15% 0 10%;
}
.contents-wrap img {
	width: auto;
	max-width: 100%;
}
.contents-wrap h3 {
	position: absolute;
	left: 6%;
	top: -8%;
	width: 30%;
}
.contents-wrap ol {
	background: #fff;
	padding: 3%;
}
.contents-wrap ol li {
	margin-top: 3%;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 3%;
}

/* コンテンツフッター */
.contents-foot {
	margin: 0 0 5%;
}

/* メディア掲載 */
.media {
	background: url(../img/bg-media-01.png);
	font-size: 70%;
	padding: 0 0 3%;
}
.media .col-6 {
	margin: 3% 0;
}
.media .col-6 img{
	width: 90%;
}
.media h4 {
	font-size: 90%;
	font-weight: bold;
	margin-top: 3%;
}

#offer-mail {
	background: #f3f3f3;
	padding: 2%;
}
#offer-mail .offer {
	background: #f3f3f3;
	padding: 2%;
	text-align: center;
}
#offer-mail p {
	font-size: 0.8em;
}
.offer .input-wrap {
	height: 50px;
	padding: 2%;
	border: 1px solid #b7b7b7;
	background: #ffffef;
}
.offer input {
	background: #fff;
	padding: 2%;
	border: none;
	width: 95%;
	height: 38px;
	font-size: 24px;
}

#offer-mail a img {
	width: 80%;
	margin: 3% auto;
}
/* テーブル */
table {
	margin: 3%;
	
}
th,td {
	font-size: 18px;
	padding: 10px;
	text-align: center;
	border: 0.2em solid #fff;
	vertical-align: middle;
}
th, .service-name {
	background: #173478;
	font-weight: bold;
	color: #fff;
}
td {
	background: #e4e4e4;
	width: 70%;
}

td.description {
	font-size: 14px;
}
.foot-nav {
	background: #e4e4e4;
	padding: 3% 0;
	font-size: 0.8em;
}
.footer img {
	width: 30%;
}
.foot-nav li {
	float: left;
	border-right: 1px solid #888;
	padding-right: 3%;
	padding-left: 3%;
	margin-top: 3%;
}
.copyright {
	background: #313131;
	border-top: 2px solid #313131;
	color: #fff;
	padding: 10px 0;
	font-size:12px;
}


/*pagetop
-----------------------------------------------------*/
#page-top {
    position: fixed;
    right: 20px;
    width: 70px;
}


/*====================================================================
   inst_btn
====================================================================*/
.inst_btn {
    width: 94%;
    margin: 3% auto 15%;
}
.inst_btn a:hover {
    opacity: 0.7;
}


.cv_btn{ background:#eff6fc; padding:0 3.125% 20px;}