@charset "utf-8";

/* 共通
------------------------------------------------------------*/
html, body {
  overflow: hidden;
}
body {
	color: #292929;
	font-size:16px;
	line-height:175%;
	letter-spacing:1px;
	-webkit-text-size-adjust: 100%;
	overflow-y: scroll;
}

a		{ color:#292929; text-decoration:none; }
a:hover { color:#e60012; }

p {
	display:block;
	margin:0 0 20px;
	font-size:105%;
}
p.Cap {
	width:85%;
	font-size:90%;
	letter-spacing:0;
	line-height:125%;
	margin:0 5px;
	text-align:left;
}

hr {
	height: 0;
	margin: 25px 0;
	padding: 0;
	border: 0;
	border-top: 7px dotted #9cc828;
}
.aligncenter { text-align:center !important; }
.alignright { text-align:right !important; }
.imgright {
	display:block;
	float:right;
	margin:0 0 15px 60px;
}
img { max-width:100%; }
.imgL { max-width:70%; }
.imgM { max-width:60%; }
.imgleft {
	display:block;
	float:left;
	margin:0 60px 15px 0;
}
.imgcenter {
	display:block;
	margin:5px auto;
}
.imgBorder { border:1px solid #dcdcdc !important; }

.TxtLL {
	font-size:175% !important;
	line-height:155%;
	letter-spacing:2px;
}
.TxtL {
	font-size:125% !important;
	line-height:165%;
	letter-spacing:2px;
}
.TxtM {
	font-size:95% !important;
	line-height:135%;
	letter-spacing:0;
}
.TxtS {
	font-size:85% !important;
	letter-spacing:0;
}
.ImgCap{font-size:90%; letter-spacing:0; width:85%; text-align:center; display:block;}
.ColRed { color:#e60012 !important; }

.PD-T20 { padding-top:20px; }
.PD-B50 { padding-bottom:50px; }

.MG0 { margin:0 !important; }
.MG-R10 { margin-right:10px !important; }
.MG-B5 { margin-bottom:5px !important; }
.MG-B20 { margin-bottom:20px !important; }
.MG-B50 { margin-bottom:50px !important; }
.MG-T5 { margin-top:5px !important; }
.MG-T10 { margin-top:10px !important; }
.MG-T50 { margin-top:50px !important; }
.MG-T70 { margin-top:70px !important; }

.post ol {
	counter-reset: li;
	line-height:145%;
}
.post ol > li {
	list-style: none;
	position: relative;/*リストの項目の位置を基準に*/
	padding: 3px 0 20px 40px; /*li:before分左に余白を。調整可*/
}

.post ol > li:before {
	counter-increment: li;
	content: counter(li);
	margin-right: 10px;
	background: #00a0e9;
	color: #ffffff;
	border-radius: 50%;
	text-align: center;
	width: 30px;
	height: 30px;
	position: absolute;
	left: 0;
	top: 0;
	padding-top:3px;
	font-size:125%;
	line-height: 1.4;
}



/* アニメーションボタン */
a.AnimeBtn {
	display: inline-block;
	text-indent:0 !important;
	padding:0 5px;
	font-size:85%;
	font-weight:bold;
	line-height:145%;
	text-align: center;
	text-decoration: none;
	outline: none;
	position: relative;
	z-index: 2;
	background-color: #06b4d9;
	border: 2px solid #06b4d9;
	color: #fff;
}
a.AnimeBtn::before,
a.AnimeBtn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
	top: 0;
	width: 50%;
	height: 100%;
	background-color: #06b4d9;
}
a.AnimeBtn,
a.AnimeBtn::before,
a.AnimeBtn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
a.AnimeBtn:hover {
	background-color: #fff;
	border-color: #333;
	color: #333 !important;
}
a.AnimeBtn::before {
	right: 0;
}
a.AnimeBtn::after {
	left: 0;
}
a.AnimeBtn:hover::before,
a.AnimeBtn:hover::after {
	width: 0;
	background-color: #333;
}
/* 緑 */
a.AnimeBtnGr {
	padding:10px 20px;
	font-size:115%;
	letter-spacing:3px;
	background-color: #3eb134;
	border: 2px solid #3eb134;
	border-radius: 5px;
	webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
a.AnimeBtnGr::before,
a.AnimeBtnGr::after {
	background-color: #3eb134;
}
/* PDFにリンクするボタン */
a.AnimeBtnL {
	display:block;
	padding:10px 20px 5px;
	font-size:145%;
	letter-spacing:0 !important;
	margin-bottom:5px;
	text-align:left;
/*	position:relative;
*/}
a.AnimeBtnL span{
/*	position:absolute;
	right:20px;
*/	font-size:70%;
	font-weight:normal;
}
/* Q&Aボタン */
a.AnimeBtnQA {
	display:block;
	font-size:105%;
	padding:10px 15px 8px;
	text-align:left;
	letter-spacing:0;
}
/* ブルー */
a.AnimeBtnGray {
	padding:5px 15px;
	font-size:95%;
	background-color: #999;
	border: 2px solid #999;
	border-radius: 5px;
	webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
a.AnimeBtnGray::before,
a.AnimeBtnGray::after {
	background-color: #999;
}


/* 全体
------------------------------------------------------------*/
#wrapper{
	display:block;
	width:100%;
	margin:0;
	padding:0;
}
.inner{
	display:block;
	width:900px;
	margin:0 auto;
}
.Content {
	background:#FFF;
	margin:0;
	padding:40px 0 25px;
}
.BgBlue { background:url(../images/bg_blue.gif); }
.BgGray { background:url(../images/bg_gray.gif); }
.BgOrange { background:url(../images/bg_orange.gif); }
.BgPink { background:url(../images/bg_pink.gif); }
.BgWhite { background: #FFF; background-image:none; }
.BgYellow { background:url(../images/bg_yellow03.gif); }

.InfoBox {
	display:block;
	margin-bottom:20px;
	padding:10px 20px;
	font-size:95%;
}

/* フェードインアニメーション */
.FadeInContent { overflow: hidden; }
.FadeInContent .ContentBox { transition: .8s; }
.list-mv07{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
}
.mv07{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}
/* 左右レイアウト */
.inner dl {
	display:block;
	margin:0 0 20px;
}
.inner dt {
	display:block;
	float:left;
	clear:both;
	width:48%;
}
.inner dd {
	display:block;
	float:right;
	width:52%;
	text-align:left;
}
.inner dt img,
.inner dd img {
	max-width:85%;
}
/* index 右側が画像 */
.inner dl.Border { border:1px solid #dcdcdc !important; }
.inner dl.Border dt {
	padding:5% 5% 0;
	width:65%;
}
.inner dl.Border dd {
	width:35%;
	line-height:0;
}
.inner dl.Border dd img { max-width:100%; }
/* index コンテンツへのリンクボックス */
.inner ul.IndexBox {
	display:block;
	margin:20px 0;
}
.inner ul.IndexBox li {
	display:block;
	border:1px solid #dcdcdc;
	width:48%;
	height:500px;
	float:left;
	position:relative;
	margin-right:4%;
}
.inner ul.IndexBox li p {
	padding:10px 5% 0;
	font-size:175%;
	line-height:115%;
}
.inner ul.IndexBox li p span {
	display:block;
	font-size:65%;
}
.inner ul.IndexBox li img { width:100%; }
.inner ul.IndexBox li:last-child { margin-right:0; }
.inner ul.IndexBox li a.LinkBtn {
	display:block;
	position:absolute;
	bottom:20px;
	font-size:65%;
	background:url(../images/icon_arrow01.png)no-repeat 0 2px;
	padding:0 0 0 27px;
	color:#e60012;
}
.inner ul.IndexBox li a.LinkBtn:hover { color:#000; }


/* 半分 */
.inner dt.HalfBox,
.inner dd.HalfBox {
	width:47%;
	text-align:left;
}

/* ※印のリスト */
ul.KomeList {
	padding-left:1em;
	margin:0 0 15px;
}
ul.KomeList li {
	text-indent:-1em;
	font-size:95%;
	margin-bottom:5px;
}
/* チェックマークのリスト */
ul.CheckList {
	margin:0 10px 30px;
}
ul.CheckList li {
	position:relative;
	padding: 0 0 5px 22px;
}
ul.CheckList li:after,ul.CheckList li:before {
	position:absolute;
	content:'';
	display:block;
	background: #000;
	top: 0.43em;
	left: 0.5em;
	height: 11px;
	width: 4px;
	border-radius: 10px;
	transform: rotate(45deg);
}
ul.CheckList li:before {
	top: 0.6em;
	left: 0.2em;
	height:8px;
	transform:rotate(-45deg);
}
/* 番号入りリスト */
ol.list_parentheses{
	padding:0 0 0 2em;
	margin:0;
}
 ol.list_parentheses li{
	list-style-type:none;
	list-style-position:inside;
	counter-increment: cnt;
	margin-bottom:20px;
}
ol.list_parentheses li:before{
	display: marker;
	content: counter(cnt) ") ";
}
ol.list_parentheses li span{
	font-weight:bold;
}
ol.list_parentheses li img{
	display:block;
	margin:10px auto 0;
}
/* ヘッダー
------------------------------------------------------------*/
#header{
	padding:0 0 10px;
    border-bottom: 1px solid #dcdcdc;
}
#header ul {
	display:block;
	margin:20px 0 10px;
	font-size:85%;
}
#header ul li {
	display:block;
	float:left;
	width:15%;
	padding:15px 0 0;
	text-align:center;
}
#header ul li.Title {
	width:30%;
	text-align:left;
	letter-spacing:0;
}
#header ul li.Logo {
	width:55%;
	padding:0 5% 0 0;
	text-align:center;
}
#header ul li img {
	display:block;
	max-width:100%;
	margin:0 auto;
}
/*slidemenu*/
.button {
   	width: 50px;
   	height: 50px;
   	position: absolute;
   	display: block;
   	background-repeat: no-repeat;
	background:url(../images/sp_menu.png) no-repeat;
   	background-position: center;
	margin:5px;
}
.menu-button-right {
	right: 0px;
    border-right: 1px solid #ddd;
}

.slidemenu a {
	display: block;
	font-size:85%;
	padding:6px 4px 5px 6px;
	color:#FFF;
	letter-spacing:1px;
	border-bottom: 1px dotted #FFF;
}
.slidemenu a:hover {
	background:url(../images/bg_yellow.gif);
	color:#33ad00;
	border-right:1px solid #33ad00;
}
/*.slidemenu ul li ul li {
	font-size:85%;
	padding-left:30px;
}
.slidemenu .slidemenu-header { position: relative; }
.slidemenu .slidemenu-header a {
	padding-top: 12px;
	padding-bottom:9px;
}
*//*plugin*/
#main {
	z-index: 1;
	margin:0;
}
.slidemenu {
	top: 0;
	width: 260px;
	position: fixed;
	visibility: hidden;
	z-index: -1;
	background:#33ad00;
	line-height:135%;
}
.slidemenu .slidemenu-body {
	height: 100%;
	overflow: hidden;
	position: relative;
}
.slidemenu .slidemenu-body .slidemenu-content { position: relative; }
.slidemenu .slidemenu-body .slidemenu-content li {
	padding-left:15px;
}

/*.slidemenu-left { left: 0; }
.slidemenu-right { right: 0; }
*/

/* フッター
------------------------------------------------------------*/
#footer{
	width:100%;
	display:block;
	clear:both;
	margin:0;
	padding:50px 0 100px;
    overflow: hidden;
    position: relative;
	border-top:1px solid #dcdcdc;
}
#footer ul {
	display:block;
    margin: 0 0 10px;
    padding: 0;
    position: relative;
    left: 50%;
	float:left;
	font-size:85%;
}
#footer ul li{
    float: left;
    margin-right: 5px;
    padding: 0 12px 0 10px;
    border-right: 1px dotted #292929;
    position: relative;
    left: -50%;
}
#footer ul li:first-child {
	    border-left: 1px dotted #292929;
}
#footer .address{
	display:block;
	clear:both;
	font-size:85%;
	margin:0;
	text-align:center;
}

/* ページトップへ */
#pagetop {
    position: fixed;
    bottom: 0;
    right: 10px;
	z-index:2;
}
#pagetop a {
    width: 108px;
    height: 108px;
    display: block;
    text-align: center;
}
#pagetop a:hover {
    color: #000;
}


/* タイトル
------------------------------------------------------------*/
h2 {
	display:block;
	text-align:center;
	font-size:205%;
	line-height:115%;
	font-weight:bold;
	padding:20px 0 10px;
	margin:0 10% 50px;
	border-bottom:5px solid #333;
}
h2 span {
	font-size:55%;
	font-weight:normal;
	padding:0 10px;
}

/* Q&Aのポップアップ
------------------------------------------------------------*/
/*.modal-window {
	-webkit-transform: translate(0, 100%);
	-moz-transform: translate(0, 100%);
	-o-transform: translate(0, 100%);
	-ms-transform: translate(0, 100%);
	transform: translate(0, 100%);
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 999;
	opacity: 0;
	line-height: 1.3;
	display: none\9;
}
.modal-window:target {
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	transform: translate(0, 0);
	opacity: 1;
}
.is-active.modal-window {
	display: block\9;
}
.modal-window:target {
	display: block\9;
}
.modal-window .modal-inner {
	position: absolute;
	top: 40px;
	left: 50%;
	padding:15px 15px 10px;
	z-index: 20;
	margin-left: -200px;
	width: 430px;
	max-width:100%;
	overflow-x: hidden;
	border-radius: 2px;
	background: #fff;
	-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
}
.modal-window .modal-inner h4 {
	letter-spacing:1px;
	font-weight:bold;
}
.modal-window .modal-inner p {
	padding: 0 7px;
	font-size:95%;
}
.modal-window .modal-close {
	display: block;
	text-indent: -100px;
	overflow: hidden;
}
.modal-window .modal-close:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AAAAAMwA0QDNTiUx4gAAAABJRU5ErkJggg==");
}
.modal-window .modal-close:after {
	content: '閉じる';
	position: absolute;
	top: 15px;
	left: 50%;
	z-index: 20;
	margin-left: 100px;
	background: #fff;
	border-radius: 2px;
	padding: 5px 10px;
	font-size: 16px;
	text-decoration: none;
	text-indent: 0;
}
.modal-window {
	-webkit-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}
*/
/* 新しいモーダルウィンドウ */
/*.lock {
    overflow:hidden;
}
.modal-content {
    position:relative;
    display:none;
    width:430px;
    margin:30px 0;
    padding:10px 20px;
    border:1px solid #F0F0F0;
    background:#fff;
	border-radius: 5px;
	webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
.modal-overlay {
    z-index:1;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:120%;
    background-color:rgba(0,0,0,0.75);
}
.modal-wrap {
    z-index:2;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow:auto;
}
.modal-open {
    color:#00f;
    text-decoration:underline;
}
.modal-open:hover {
    color:#f00;
}
.modal-close {
	cursor : pointer;
	margin:10px 0 0;
	background:#E1E1E1;
	padding:3px 15px;
	border-radius: 3px;
	webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.modal-close:hover {
	background:#FFC;
}*/

/* 新しいモーダルウィンドウ2 */
/*@keyframes modalwindow_body_in {
	0% { transform: translateY(-20px); }
	100% { transform: translateY(0px); }
}
@keyframes modalwindow_body_out {
	0% { transform: translateY(0px); }
	100% { transform: translateY(-20px); }
}
.modalwindow {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	overflow: auto;
	z-index: 9999;
	width: 100%;
	height: calc(100% + 100px);
	background: rgba(0, 0, 0, 0.5);
	border-bottom: 100px solid transparent;
	cursor: pointer;
	opacity: 1;
}
.modalwindow.no_overlay_close { cursor: default; }
.modalwindow.lock .close_modal { background: #ccc; }
.modalwindow .body {
	position: relative;
	left: 50%;
	top: 0;
	width: 600px;
	margin-left: -300px;
	margin-top: 40px;
	margin-bottom: 10px;
	background: #fff;
	border-radius: 4px;
	cursor: default;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
	transform: translateY(-20px);
	animation: 200ms modalwindow_body_out;
}
.modalwindow .body .modal_content { padding: 15px; }
.modalwindow .body > footer {
	padding: 10px;
	background: #fcfcfc;
	border-radius: 0 0 4px 4px;
	border-top: 1px solid #e5e5e5;
}
.modalwindow.is_visible .body {
	transform: translateY(0px);
	animation: 400ms modalwindow_body_in;
}
.modalwindow_header_close {
	position: absolute;
	right: 0;
	top: 5px;
	background: none;
	border: none;
	cursor: pointer;
}
.modalwindow_header_close:before {
	content: "\D7";
	font-size: 24px;
	font-family: serif;
	color: #ccc;
}
.modalwindow .close_modal {
    display: inline-block;
    padding: 5px 20px;
	font-size:85%;
	font-weight:bold;
    text-decoration: none;
    color: #3eb134;
    border: solid 1px #3eb134;
    border-radius: 3px;
    transition: .4s;
}
.modalwindow .close_modal:hover {
    background: #3eb134;
    color: white;
}
.modalwindow .body h4 {
	letter-spacing:1px;
	font-weight:bold;
}
.modalwindow .body p {
	padding: 0 7px;
	font-size:95%;
}
*/

/* 新しいモーダルウィンドウ3 */
.lock { overflow:hidden; }
.modal-content {
    
    display:none;
    width:94%;
	max-width:600px;
    margin:10px auto;
    padding:10px 15px;
    background:#fff;
	border-radius: 4px;
}
.modal-content h4 {
	letter-spacing:1px;
	font-weight:bold;
}
.modal-content p {
	font-size:95%;
	padding:0 5px 15px;
}
.modal-overlay {
    z-index:1;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:120%;
    background-color:rgba(0,0,0,0.75);
}

.modal-wrap {
    z-index:2;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow:auto;
}

.modal-open {
    text-decoration:underline;
}

.modal-open:hover {
    cursor:pointer;
}

.modal-close {
    display: inline-block;
    padding: 5px 20px;
	font-size:85%;
	font-weight:bold;
    text-decoration: none;
    color: #3eb134;
    border: solid 1px #3eb134;
    border-radius: 3px;
    transition: .4s;
}

.modal-close:hover {
    cursor:pointer;
    background: #3eb134;
    color: white;
}














@media screen and (max-width: 900px) {
/*	.modalwindow .body {
    	position: relative;
    	width: calc(100% - 20px);
    	margin: 10px;
    	left: 0;
  	}
*/}

@media only screen and (min-width: 900px){
}
@media only screen and (max-width:899px){
	.inner { width:94%;  }
	.inner img { max-width:100%;	}
	.inner img.imgright,
	.inner img.imgleft {
		float:none;
		margin:0 auto 15px;
	}
	.PD-T20 { padding-top:0; }
	.TxtL {
		font-size:115%;
		line-height:145%;
	}
	/* 左右レイアウト */
	.inner dt,
	.inner dd {
		float:none;
		width:100%;
	}
	.inner dt {
		text-align:center;
		margin-bottom:20px;
	}
	.inner dl.Border dt {
		width:100%;
		padding:5% 5% 0;
		text-align:left;
	}
	.inner dl.Border dd {
		width:100%;
		text-align:center;
		padding:0 5% 5%;
	}
	#header ul li,
	#header ul li.Title,
	#header ul li.Logo {
		float:none;
		width:100%;
		padding:0;
	}
	#header ul li.Title {
		text-align:center;
		line-height:145%;
		margin-bottom:5px;
	}

	a.AnimeBtnL { font-size:125%; }
	a.AnimeBtnL span{ font-size:80%; }
	p.Cap {
		width:60%;
		margin:0 auto 15px;
	}
}
/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
	h2 {
		font-size:175%;
		line-height:115%;
		margin:0 7% 30px;
	}
	.inner ul.IndexBox {
		margin:20px 0 0;
	}
	.inner ul.IndexBox li {
		width:100%;
		height:auto;
		float:none;
		margin:0 0 30px;
	}
	.inner ul.IndexBox li p {
		margin-bottom:100px;
	}
	a.AnimeBtnL { font-size:115%; letter-spacing:1px; padding:10px 10px 5px; }
	a.AnimeBtnL span{
		display:block;
	}
	p.Cap { width:80%; }
}
/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px){
}