@charset "utf-8";
/* CSS Document */





/*スマホ版レイアウト*/

main{width:100%; margin:80px auto 0 auto;}


/* ローディング画面 */
#loading {width:100vw; height:100vh; transition:all 1s; background-color:rgba(12,59,75,1); position:fixed; top:0; left:0; z-index:9999; }
.spinner {width:360px; margin:42vh auto;}
.spinner h1{width:100%; text-align:center; color:#FFF; font-size:220%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner p{text-align:center; letter-spacing:1em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }
.loaded {animation-name:load; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes load{ 0% { opacity:1;} 33% { opacity:1;} 66% { opacity:1;} 100% {opacity:0; visibility:hidden;} }

.spinner-subcontents {width:360px; margin:42vh auto;}
.spinner-subcontents h1{text-align:center; color:#FFF; font-size:220%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner-subcontents p{text-align:center; letter-spacing:0.4em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }

/*トップページ*/
#first-view {width:100%; height:750px; margin:75px 0 0 0; background:none; position:relative;}
#first-view strong {display:block; width:82%; position:absolute; top:10%; left:10%; font-size:170%; color:#FFF; text-shadow:0px 0px 7px #015845; line-height:2.1em;}
#first-view strong span.comment-top01 {display:block;}
#first-view strong span.comment-top02 {display:block;}
#first-view p {width:80%; display:block; position:absolute; top:48%; left:10%; font-size:110%; font-weight:bold; color:#111; line-height:2.4em!important;}
#first-view .scroll {display:block; animation: 2.5s scroll infinite; font-size:140%; font-weight:bold; position:absolute; z-index:3; top:80%; left:43%; color:#015845;}
	@keyframes scroll {0%, 100% {transform: translateY(10px);}50%{transform: translateY(-10px);}}
#first-view span.line01,#first-view span.line02{ display:block; position:relative; width:20px; height:20px; border-top:4px solid #015845; border-right:4px solid #015845; -webkit-transform: rotate(135deg); transform: rotate(135deg);}
#first-view span.line01 {left:20px; top:-6px;}
#first-view span.line02 {left:20px; top:-18px;}

#second-view {width:100%; height:1250px; margin:48px 0 125px 0; background:#9FDAD1; position:relative;}
#second-view h2{display:block; background:#015845; font-size:130%; color:#FFF; text-align:center; padding:15px 5%; width:90%; position:relative;}
#second-view h2:before{content: ''; position:absolute; top: 100%; left: 50%; transform: translateX(-50%); border-top: 15px solid #015845; border-right: 15px solid transparent; border-left: 15px solid transparent;}
.view-contents {width:100%; margin:0 auto;}

#news {width:calc(85% - 60px); margin:60px auto 80px auto; background:#FFF; border-radius:10px 10px; opacity:0.9; padding:30px 45px 45px 45px;}
#news h2 {text-align:center; font-size:1.5em; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #666;}
#news dt {width:24%; display:inline-block; padding:13px 0; border-bottom:1px solid #BBB; font-size:80%;}
#news dd {width:73%; display:inline-block; padding:13px 0; border-bottom:1px solid #BBB; font-size:80%; margin-left:3%;}

/*コンテンツ*/
section{background:#FFF; border-radius:120px 20px; opacity:0.8; position:relative;}
#chapter1 {width:calc(85% - 50px); height:1140px; padding:60px 40px; margin:0 auto 90px auto;}
#chapter2 {width:calc(85% - 50px); height:1170px; padding:60px 40px; margin:0 auto 90px auto;}
#chapter3 {width:calc(85% - 50px); height:1070px; padding:60px 40px; margin:0 auto 90px auto;}
#chapter4 {width:calc(85% - 50px); height:1230px; padding:60px 40px; margin:0 auto 90px auto;}

/*セカンドビューグラフ*/
#second-view p.question{padding-top:45px; width:86%; margin:0 auto; text-align:center; font-size:130%; font-weight:bold;}
#second-view .chart{padding:30px 0 250px 0; width:380px; margin:0 auto;}
#second-view p.soudan{display:block; width:380px; padding-bottom:20px; text-align:left; line-height:2.0em; font-size:110%; font-weight:bold; margin:0 auto;}
#second-view p.soudan span{color:#F33; font-weight:bold;}
#second-view i{position:absolute; top:615px; left:2.5%; display:block; width:170px; height:155px; padding:20px; background:#F4E6AA; border-radius:10px 10px; font-size:90%; font-style:normal;}
#second-view i a{display:block; font-size:70%; font-weight:bold; font-style:normal; color:#015845; line-height:190%; margin-top:15px;}
#second-view i:before{  content:""; position:absolute;  top:-10px; right:25px; margin-top:-15px; border:15px solid transparent; border-bottom:15px solid #F4E6AA;}
#second-view p.point{position:absolute; line-height:1.6em; top:615px; right:2.5%; display:block; width:170px; height:155px; padding:20px; background:#F4E6AA; border-radius:10px 10px; font-size:90%;}
#second-view p.point span{font-weight:bold; color:#F00;}
#second-view p.point:before{  content:""; position:absolute;  top:-10px; left:25px; margin-top:-15px; border:15px solid transparent; border-bottom:15px solid #F4E6AA;}
#second-view  a.buttondesign{display:block; border-radius:8px; width:300px; padding:15px 0; text-align:center; animation-name:firstview-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:1210px; left:calc(50% - 150px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111; text-decoration:none;}
@keyframes firstview-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*画像ディレイ*/
section span.left-image img{position:absolute; top:120px; left:calc(50% - 90px); width:180px; height:180px; border-radius:90px; background:#F9F;
animation-name:imagefade-01; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-01{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }
section span.right-image img{position:absolute; top:120px; right:calc(50% - 90px); width:180px; height:180px; border-radius:90px; background:#F9F;
animation-name:imagefade-02; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-02{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }

/*サービス内コンテンツ*/
section h2{text-align:center; font-size:1.5em; margin-bottom:60px;}
#chapter1 .wrap-contents,#chapter3 .wrap-contents{font-size:90%; margin:235px 0 0 0;}
#chapter2 .wrap-contents,#chapter4 .wrap-contents{font-size:90%; margin:235px 0 0 0;}
.wrap-contents p{margin-bottom:15px; line-height:1.95em; font-size:125%; position:relative; z-index:10;}

/*ボタン*/
#chapter1 a.buttondesign{display:block; border-radius:8px; width:300px; padding:12px 0; text-align:center; animation-name:button01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:1130px; left:calc(50% - 150px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); text-decoration:none; font-size:1.1em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button01-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter2 a.buttondesign{display:block; border-radius:8px; width:300px; padding:12px 0; text-align:center; animation-name:button02-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:1170px; left:calc(50% - 150px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); text-decoration:none; font-size:1.1em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button02-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter3 a.buttondesign{display:block; border-radius:8px; width:300px; padding:12px 0; text-align:center; animation-name:button03-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:1070px; left:calc(50% - 150px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); text-decoration:none; font-size:1.1em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button03-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter4 a.buttondesign{display:block; border-radius:8px; width:300px; padding:12px 0; text-align:center; animation-name:button04-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:1230px; left:calc(50% - 150px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); text-decoration:none; font-size:1.1em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button04-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*hover*/
#chapter1 a:hover,#chapter2 a:hover,#chapter3 a:hover,#chapter4 a:hover{background:rgba(1,88,69,1); opacity:1; color:#FF0;}


/*内部ページ基本デザイン*/

#contents-service-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage01.jpg) no-repeat center top; z-index:1;}
#contents-about-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage04.jpg) no-repeat center top; z-index:1;}
#contents-support-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage02.jpg) no-repeat center top; z-index:1;}
#contents-contact-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage03.jpg) no-repeat center top; z-index:1;}
#contents-service-view h2,#contents-about-view h2,#contents-support-view h2,#contents-contact-view h2{text-align:center; color:#FFF; text-shadow:0px 0px 10px #111;; font-size:160%; position:relative; top:55px; z-index:2;}
.contents-start {width:420px; margin:0 auto; padding:40px 0; margin:100px auto 70px auto; background-color:rgba(255,255,255,.9); border-radius:15px 15px; z-index:2; }


/*内部ページ詳細*/

.contents-start article{margin:0 0 70px 0;}
.contents-start p{font-size:120%; line-height:1.9em; margin-bottom:20px;}
.contents-start p img{width:180px; height:180px; border-radius:90px 90px; margin:0 auto 45px auto; display:block;}
.contents-start h3{font-size:140%; font-weight:bold; text-align:center; margin:0 0 45px 0; line-height:1.2em;}
.contents-start h3 span{border-bottom:5px solid rgba(1,88,69,1)}
.contents-start h4{font-size:115%; font-weight:bold; margin:0 0 20px 0; line-height:1.3em;}
.contents-start section.works-contents{display:block; padding:30px; margin-bottom:40px; background-color:#FF8; border-radius:30px;}
.contents-start .supplement{font-size:80%; margin-bottom:0;}
.contents-start ul.works-common{margin:0 0 20px 0;}
.contents-start ul.works-common li{font-size:70%; display:block; background:#FFF; padding:10px 15px; margin-bottom:15px; font-weight:bold; position:relative; width:calc(70% - 30px);}
.contents-start ul.works-common li span{font-size:90%; position:absolute; display:block; top:0; right:calc(-32% - 20px); color:#FFF; padding:10px; background:#015845; width:32%; text-align:center; cursor:pointer;}

.contents-start ul.point{display:block; margin:20px 0 30px 0;}
.contents-start ul.point li{display:block; margin-bottom:10px;}
.contents-start ul.point li.pointif-01{background:#FFA;}
.contents-start ul.point li.pointif-02{background:#EE9;}
.contents-start ul.point li.pointif-03{background:#DD8;}
.contents-start ul.point li.pointif-04{background:#C6C677;}
.contents-start ul.point li.pointif-05{background:#BB5;}
.contents-start ul.point li p{display:block; margin:0; padding:15px; font-size:110%; line-height:1.5em;}
.contents-start ul.point li span{display:inline-block; width:100%; padding:13px 0; text-align:center; font-weight:bold; font-size:130%; background:#015845; color:#FFF;}

.contents-start .chart-set{width:360px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set h4{text-align:center; width:100%; margin:0 0 20px 0; font-size:115%;}
.contents-start .chart-set2{width:80%; height:440px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set2 h4{text-align:center; width:100%; margin:0 0 20px 0; font-size:115%;}
.contents-start ul.service-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.service-point li{display:block; background:#FF8; margin-bottom:10px; font-size:100%;}
.contents-start ul.service-point li p{display:block; font-size:90%; padding:0 10px 10px 10px;}
.contents-start ul.service-point li span{display:inline-block; padding:13px 77px 13px 78px; font-weight:bold; font-size:120%; background:#015845; color:#FFF; margin-right:0; letter-spacing:0.1em;}
.contents-start ul.service-point li strong{display:inline-block; padding:13px 10px 6px 15px; font-weight:bold; font-size:110%; letter-spacing:0.1em; margin-right:40px;}
.contents-start ul.assignment-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.assignment-point li{display:block; padding:10px; font-weight:bold; font-size:110%; background:#015845; color:#FFF; margin-bottom:10px;}

article .arrow{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow:before{
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-top: 15px solid #EEE;  /* 好みで色を変えてください */ 
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
}
article .arrow-last{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow dt,
article .arrow-last dt{
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;
}
.extra-margin{margin-bottom:50px!important;}

/*スワイプ用*/
.swiper {
    width: 90%;
    height: 450px;
    border:1px solid #aaa;
    border-radius: 10px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
    .selfcheck-contents strong{
        font-size:200%;
        padding:80px 0 50px 0;
        display:block;
    }
    .selfcheck-contents p{
	width:70%;
	margin:0 15% 30px 15%;
        display:block;
	font-size:105%;
	line-height:1.5em;
    }
    .selfcheck-contents .radiobox{
	margin:0 auto;
        display:block;
	width:160px;
    }
    .selfcheck-contents input[type=radio] {
	display:none;
	}
    .selfcheck-contents input[type=radio]:checked + label {
	background:#31A9EE;
	color:#ffffff;
	}

    .label:hover {
	background-color:#E2EDF9;
	}
    .selfcheck-contents .label {
	display:block;
	float:left;
	font-size:130%;
	margin:10px;
	width:120px;
	height:40px;
	padding:0 10px;
	color:#b20000;
	text-align:center;
	line-height:40px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
}
    .selfcheck-end strong{
        font-size:180%;
        padding:80px 0 40px 0;
        display:block;
    }
    .selfcheck-end p{
	width:64%;
	margin:0 18% 30px 18%;
        display:block;
	font-size:95%;
	line-height:1.5em;
    }
    .selfcheck-end input[type=submit] {
	display:block;
	font-size:130%;
	width:120px;
	height:40px;
	padding:0 10px;
	margin:0 auto;
	color:#b20000;
	text-align:center;
	line-height:40px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
	}
    .selfcheck-end input[type=submit]:hover {
	background:#31A9EE;
	color:#ffffff;
	}
	#answer{
	display:block;
	text-align:center;
	font-weight:bold;
	position:relative;
	padding:30px;
	width:calc(90% - 60px);
	border-radius:10px;
	margin:20px auto 45px auto;
	background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%);
	font-size:1.2em;
	color:#FFF;}
		#answer::after{
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		border-top: 30px solid rgba(1,88,69,1);
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		}


/*お問い合わせボタン*/
.contents-start a.contactbutton{display:block; border-radius:8px; width:300px; padding:12px 0; text-align:center; margin:40px auto 0 auto;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); text-decoration:none; font-size:1.1em; line-height:1.3em; color:#FFF; font-weight:bold; box-shadow:0 0 5px #111;}


/*アコーディオン用*/
.accordion-container{position:relative; width:100%; border-top:none; outline:0;}
.accordion-container .article-title{display:block; position:relative; margin:10px 6%; padding:0.75em 3.5em 0.75em 1.25em; font-size:105%; font-weight:bold; background: rgba(12,59,75,1); color:#FFF; cursor:pointer; border-radius:20px;}.accordion-container .article-title p{margin-bottom:0;}
.accordion-container .article-title:hover,
.accordion-container .article-title:active,
.accordion-container .content-entry.open .article-title{background-color:#E0DAC5; color:#111;}
.accordion-container .article-title:hover i:before,
.accordion-container .article-title:hover i:active,
.accordion-container .content-entry.open i{color:#111;}
.article-title{position:relative;}
.article-title a{color:#FFF;}
.article-title:after{content:""; position:absolute; right:25px; top:32%; transition:all 0.2s ease-in-out; display:block; width:8px; height:8px; border-top:solid 4px #FFF; border-right:solid 4px #FFF; -webkit-transform:rotate(135deg); transform:rotate(135deg);}
.article-title.open:after{-webkit-transform:rotate(-45deg); transform:rotate(-45deg); top:45%;}
.accordion-content{margin:10px 6%; padding:0 1.25em 0.75em 1.25em; font-size:100%; display:none; cursor:auto;}
.accordion-content p{margin:0 0 10px 0!important;}
.accordion-container{width:100%; margin:1.875em auto;}
.accordion-content h4 {font-size:125%; margin:20px 0 10px 0;}

/*新着情報*/
ul.newsbox{
	width:100%;
	display:block;
	font-size:110%;
}
ul.newsbox li{
	background:#FFFFCC;
	margin-bottom:1px;
	border-top:1px solid #CC9;
}
ul.newsbox li:nth-child(2n){
	background:#FFF;
}
ul.newsbox li:last-child{
	border-top:1px solid #CC9;
	border-bottom:1px solid #CC9;
}
ul.newsbox li time{
	display:block;
	width:calc(100% - 30px);
	padding:15px 15px 0 15px;
	font-weight:bold;
}
ul.newsbox li p{
	display:block;
	width:calc(100% - 30px);
	padding:15px;
	margin:0;
	line-height:1.4em;
}
ul.article-list{
	width:100%;
	padding:40px 0 15px 0;
	border-top:1px solid #CCC;
	margin-top:50px;
	display:block;
}
h3.newstitle{
	line-height:1.5em;
}
time.newstime{
	display:inline-block;
	font-size:90%;
	margin-bottom:10px;
	padding:5px 10px;
	background:rgba(12,59,75,1);
	color:#FFF;
}
ul.article-list li.next,
ul.article-list li.prev{
	width:33%;
	display:block;
	float:left;
}
ul.article-list li.home{
	width:34%;
	display:block;
	float:left;
}
ul.article-list li.next::before{
	content: "<- ";
}
ul.article-list li.prev::after{
	content: " ->";
}
ul.article-list li.next{
	text-align:left;
}
ul.article-list li.home{
	text-align:center;
}
ul.article-list li.prev{
	text-align:right;
}

/*サイトマップ*/
ul.sitemap{
	display:block;
	position:relative;
	width:100%;
	height:730px;
	margin:60px 0 80px 0;
	z-index:20;
}
	/*すべてに適用するため表記ここだけでOK*/
	ul.sitemap span.h-line01{
		display:block;
		border:3px solid #015845;
		height:648px;
		z-index:10;
		position:absolute;
		top:50px;
		left:30px;
	}
	ul.sitemap span.h-line02{
		display:block;
		border:3px solid #015845;
		height:160px;
		z-index:10;
		position:absolute;
		top:111px;
		left:100px;
	}
	ul.sitemap span.h-line03{
		display:block;
		border:3px solid #015845;
		height:115px;
		z-index:10;
		position:absolute;
		top:352px;
		left:100px;
	}
	ul.sitemap span.w-line01{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:83px; left:30px;
	}
	ul.sitemap span.w-line02{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:136px; left:100px;
	}
	ul.sitemap span.w-line03{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:181px; left:100px;
	}
	ul.sitemap span.w-line04{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:226px; left:100px;
	}
	ul.sitemap span.w-line05{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:271px; left:100px;
	}
	ul.sitemap span.w-line06{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:324px; left:30px;
	}
	ul.sitemap span.w-line07{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:377px; left:100px;
	}
	ul.sitemap span.w-line08{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:422px; left:100px;
	}
	ul.sitemap span.w-line09{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:467px; left:100px;
	}
	ul.sitemap span.w-line10{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:519px; left:30px;
	}
	ul.sitemap span.w-line11{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:579px; left:30px;
	}
	ul.sitemap span.w-line12{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:639px; left:30px;
	}
	ul.sitemap span.w-line13{
		display:block; border:3px solid #015845; width:34px; z-index:10; position:absolute; top:699px; left:30px;
	}
ul.sitemap li{
	display:block;
	position:absolute;
}
ul.sitemap li a{
	color:#FFF;
	text-decoration:underline;
}
ul.sitemap li a:hover{
	text-decoration:none;
}
	ul.sitemap li.top-directry{width:calc(100% - 40px); padding:15px 20px; background:rgba(1,88,69,1); color:#FFF; top:0; left:0;}
	ul.sitemap li.top-contents{width:calc(100% - 110px); padding:15px 20px; background:rgba(1,88,69,0.85); color:#FFF;}
		ul.sitemap li.sub-contents01{top:120px; left:140px;}
		ul.sitemap li.sub-contents02{top:165px; left:140px;}
		ul.sitemap li.sub-contents03{top:210px; left:140px;}
		ul.sitemap li.sub-contents04{top:255px; left:140px;}
	ul.sitemap li.cont-no-01{top:60px; left:70px;}
	ul.sitemap li.cont-no-02{top:300px; left:70px;}
		ul.sitemap li.sub-contents05{top:360px; left:140px;}
		ul.sitemap li.sub-contents06{top:405px; left:140px;}
		ul.sitemap li.sub-contents07{top:450px; left:140px;}
	ul.sitemap li.cont-no-03{top:495px; left:70px;}
	ul.sitemap li.cont-no-04{top:555px; left:70px;}
	ul.sitemap li.cont-no-05{top:615px; left:70px;}
	ul.sitemap li.cont-no-06{top:675px; left:70px;}
		ul.sitemap li.sub-contents01,ul.sitemap li.sub-contents02,ul.sitemap li.sub-contents03,ul.sitemap li.sub-contents04,ul.sitemap li.sub-contents05,ul.sitemap li.sub-contents06,ul.sitemap li.sub-contents07{
			width:calc(100% - 170px); font-size:75%; background:rgba(1,88,69,0.7); color:#FFF; padding:10px 15px;
		}



/*-------------------------------------------------*/


/*TB版たてレイアウト*/

@media screen and (min-width:481px) and ( max-width:768px){

main{width:100%; margin:80px auto 0 auto;}

/* ローディング画面 */
#loading {width:100vw; height:100vh; transition:all 1s; background-color:rgba(12,59,75,1); position:fixed; top:0; left:0; z-index:9999; }
.spinner {width:540px; margin:42vh auto;}
.spinner h1{width:100%; text-align:center; color:#FFF; font-size:320%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner p{text-align:center; letter-spacing:1.5em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }
.loaded {animation-name:load; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes load{ 0% { opacity:1;} 33% { opacity:1;} 66% { opacity:1;} 100% {opacity:0; visibility:hidden;} }

.spinner-subcontents {width:720px; margin:42vh auto;}
.spinner-subcontents h1{text-align:center; color:#FFF; font-size:320%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner-subcontents p{text-align:center; letter-spacing:0.4em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }

/*トップページ*/
#first-view {width:100%; height:800px; margin:75px 0 0 0; background:none; position:relative;}
#first-view strong {display:block; width:82%; position:absolute; top:14%; left:10%; font-size:240%; color:#FFF; text-shadow:0px 0px 7px #015845; line-height:1.7em;}
#first-view strong span.comment-top01 {display:block;}
#first-view strong span.comment-top02 {display:block;}
#first-view p {width:80%; display:block; position:absolute; top:52%; left:10%; font-size:140%; font-weight:bold; color:#111; line-height:2em!important;}
#first-view .scroll {display:block; animation: 2.5s scroll infinite; font-size:140%; font-weight:bold; position:absolute; z-index:3; top:82%; left:47%; color:#015845;}
	@keyframes scroll {0%, 100% {transform: translateY(10px);}50%{transform: translateY(-10px);}}
#first-view span.line01,#first-view span.line02{ display:block; position:relative; width:20px; height:20px; border-top:4px solid #015845; border-right:4px solid #015845; -webkit-transform: rotate(135deg); transform: rotate(135deg);}
#first-view span.line01 {left:20px; top:-6px;}
#first-view span.line02 {left:20px; top:-18px;}

#second-view {width:100%; height:940px; margin:48px 0 125px 0; background:#9FDAD1; position:relative;}
.view-contents {width:100%; margin:0 auto;}

#news {width:calc(85% - 60px); margin:60px auto 80px auto; background:#FFF; border-radius:10px 10px; opacity:0.9; padding:30px 45px 45px 45px;}
#news h2 {text-align:center; font-size:1.5em; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #666;}
#news dt {width:20%; display:inline-block; padding:15px 0; border-bottom:1px solid #BBB; font-size:100%;}
#news dd {width:79%; display:inline-block; padding:15px 0; border-bottom:1px solid #BBB; margin-left:0; font-size:100%;}

/*コンテンツ*/
section{background:#FFF; border-radius:120px 20px; opacity:0.8; position:relative;}
#chapter1 {width:calc(85% - 90px); height:920px; padding:60px; margin:0 auto 90px auto;}
#chapter2 {width:calc(85% - 90px); height:950px; padding:60px; margin:0 auto 90px auto;}
#chapter3 {width:calc(85% - 90px); height:850px; padding:60px; margin:0 auto 90px auto;}
#chapter4 {width:calc(85% - 90px); height:960px; padding:60px; margin:0 auto 90px auto;}

/*セカンドビューグラフ*/
#second-view p.question{padding-top:45px; width:60%; margin:0 auto; text-align:center; font-size:130%; font-weight:bold;}
#second-view .chart{padding:35px 0; width:380px; margin:0 auto;}
#second-view p.soudan{width:600px; padding-bottom:20px; text-align:left; font-size:110%; font-weight:bold; margin:0 auto; line-height:2.0em;}
#second-view p.soudan span{color:#F33; font-weight:bold;}
#second-view i{position:absolute; top:310px; left:2.5%; display:block; width:140px; height:175px; padding:20px; background:#F4E6AA; border-radius:10px 10px; font-size:90%; font-style:normal;}
#second-view i a{display:block; font-size:70%; font-weight:bold; font-style:normal; color:#015845; line-height:190%; margin-top:15px;}
#second-view i:before{  content:""; position:absolute;  top:50%; right:-25px; margin-top:-15px; border:15px solid transparent; border-left:15px solid #F4E6AA;}
#second-view p.point{position:absolute; line-height:1.6em; top:310px; right:2.5%; display:block; width:140px; height:175px; padding:20px; background:#F4E6AA; border-radius:10px 10px; font-size:85%;}
#second-view p.point span{font-weight:bold; color:#F00;}
#second-view p.point:before{  content:""; position:absolute;  top:50%; left:-25px; margin-top:-15px; border:15px solid transparent; border-right:15px solid #F4E6AA;}
#second-view  a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:firstview-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:900px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes firstview-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*画像ディレイ*/

section span.left-image img{position:absolute; top:110px; left:calc(50% - 90px); width:180px; height:180px; border-radius:90px; background:#F9F;
animation-name:imagefade-01; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-01{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }
section span.right-image img{position:absolute; top:110px; right:calc(50% - 90px); width:180px; height:180px; border-radius:90px; background:#F9F;
animation-name:imagefade-02; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-02{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }

/*サービス内コンテンツ*/
section h2{text-align:center; font-size:2.0em; margin-bottom:60px;}
#chapter1 .wrap-contents,#chapter3 .wrap-contents{font-size:90%; margin:215px 0 0 0;}
#chapter2 .wrap-contents,#chapter4 .wrap-contents{font-size:90%; margin:215px 0 0 0;}
.wrap-contents p{margin-bottom:15px; font-size:110%; line-height:2.3em; position:relative; z-index:10;}

/*ボタン*/
#chapter1 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:900px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button01-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter2 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button02-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:950px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button02-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter3 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button03-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:850px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button03-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter4 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button04-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:960px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button04-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*hover*/
#chapter1 a:hover,#chapter2 a:hover,#chapter3 a:hover,#chapter4 a:hover{background:rgba(1,88,69,1); opacity:1; color:#FF0;}


/*内部ページ基本デザイン*/

#contents-service-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage01.jpg) no-repeat center top; z-index:1;}
#contents-about-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage04.jpg) no-repeat center top; z-index:1;}
#contents-support-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage02.jpg) no-repeat center top; z-index:1;}
#contents-contact-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage03.jpg) no-repeat center top; z-index:1;}
#contents-service-view h2,#contents-about-view h2,#contents-support-view h2,#contents-contact-view h2{text-align:center; color:#FFF; text-shadow:0px 0px 10px #111;; font-size:200%; position:relative; top:80px; z-index:2;}
.contents-start {width:560px; margin:0 auto; padding:60px; margin:140px auto 70px auto; background-color:rgba(255,255,255,.9); border-radius:15px 15px; z-index:2; }


/*内部ページ詳細*/

.contents-start article{margin:0 0 70px 0;}
.contents-start p{font-size:100%; line-height:1.9em; margin-bottom:20px;}
.contents-start p img{width:180px; height:180px; border-radius:90px 90px; margin:0 auto 45px auto; display:block;}
.contents-start h3{font-size:160%; font-weight:bold; text-align:center; margin:0 0 45px 0; line-height:1.2em;}
.contents-start h3 span{border-bottom:5px solid rgba(1,88,69,1)}
.contents-start h4{font-size:130%; font-weight:bold; margin:0 0 20px 0; line-height:1.3em;}
.contents-start section.works-contents{display:block; padding:30px; margin-bottom:40px; background-color:#FF8; border-radius:30px;}
.contents-start .supplement{font-size:80%; margin-bottom:0;}
.contents-start ul.works-common{margin:0 0 20px 0;}
.contents-start ul.works-common li{font-size:100%; display:block; background:#FFF; padding:10px 15px; margin-bottom:15px; font-weight:bold; position:relative; width:calc(70% - 30px);}
.contents-start ul.works-common li span{position:absolute; display:block; top:0; right:calc(-30% - 40px); color:#FFF; padding:10px 20px; background:#015845; width:30%; text-align:center; cursor:pointer;}

.contents-start ul.point{display:block; margin:20px 0 30px 0;}
.contents-start ul.point li{display:block; margin-bottom:10px; position:relative;}
.contents-start ul.point li.pointif-01{background:#FFA;}
.contents-start ul.point li.pointif-02{background:#EE9;}
.contents-start ul.point li.pointif-03{background:#DD8;}
.contents-start ul.point li.pointif-04{background:#C6C677;}
.contents-start ul.point li.pointif-05{background:#BB5;}
.contents-start ul.point li p{display:block; position:absolute; width:calc(100% - 130px); margin:0; top:6px; left:127px; font-size:80%; line-height:1.4em; padding:0;}
.contents-start ul.point li span{display:inline-block; width:90px; padding:21px 14px; margin-right:15px; font-weight:bold; font-size:130%; background:#015845; color:#FFF;}

.contents-start .chart-set{width:360px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set h4{text-align:center; width:600px; margin:0 -120px 20px -120px; font-size:95%;}
.contents-start .chart-set2{width:80%; height:440px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set2 h4{text-align:center; width:600px; margin:0 -120px 20px -120px; font-size:95%;}
.contents-start ul.service-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.service-point li{display:block; background:#FF8; margin-bottom:10px; font-size:100%;}
.contents-start ul.service-point li p{display:block; font-size:70%; padding:10px 8px;}
.contents-start ul.service-point li span{display:inline-block; padding:13px 20px; font-weight:bold; font-size:110%; background:#015845; color:#FFF; margin-right:10px; letter-spacing:0.1em;}
.contents-start ul.service-point li strong{display:inline-block; padding:13px 8px; font-weight:bold; font-size:110%; letter-spacing:0.1em; margin-right:40px;}
.contents-start ul.assignment-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.assignment-point li{display:block; padding:10px; font-weight:bold; font-size:110%; background:#015845; color:#FFF; margin-bottom:10px;}

article .arrow{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow:before{
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-top: 15px solid #EEE;  /* 好みで色を変えてください */ 
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
}
article .arrow-last{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow dt,
article .arrow-last dt{
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;
}
.extra-margin{margin-bottom:50px!important;}

/*スワイプ用*/
.swiper {
    width: 90%;
    height: 450px;
    border:1px solid #aaa;
    border-radius: 10px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
    .selfcheck-contents strong{
        font-size:200%;
        padding:110px 0 50px 0;
        display:block;
    }
    .selfcheck-contents p{
	width:70%;
	margin:0 15% 30px 15%;
        display:block;
	font-size:105%;
	line-height:1.5em;
    }
    .selfcheck-contents .radiobox{
	margin:0 auto 50px auto;
        display:block;
	width:330px;
    }
    .selfcheck-contents input[type=radio] {
	display:none;
	}
    .selfcheck-contents input[type=radio]:checked + label {
	background:#31A9EE;
	color:#ffffff;
	}

    .label:hover {
	background-color:#E2EDF9;
	}
    .selfcheck-contents .label {
	display:block;
	float:left;
	font-size:130%;
	margin:10px;
	width:120px;
	height:60px;
	padding:0 10px;
	color:#b20000;
	text-align:center;
	line-height:60px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
}
    .selfcheck-end strong{
        font-size:200%;
        padding:80px 0 50px 0;
        display:block;
    }
    .selfcheck-end p{
	width:70%;
	margin:0 15% 30px 15%;
        display:block;
	font-size:105%;
	line-height:1.5em;
    }
    .selfcheck-end input[type=submit] {
	display:block;
	font-size:130%;
	width:120px;
	height:60px;
	padding:0 10px;
	margin:0 auto;
	color:#b20000;
	text-align:center;
	line-height:60px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
	}
    .selfcheck-end input[type=submit]:hover {
	background:#31A9EE;
	color:#ffffff;
	}
	#answer{
	display:block;
	text-align:center;
	font-weight:bold;
	position:relative;
	padding:30px;
	width:calc(90% - 60px);
	border-radius:10px;
	margin:20px auto 45px auto;
	background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%);
	font-size:1.5em;
	color:#FFF;}
		#answer::after{
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		border-top: 30px solid rgba(1,88,69,1);
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		}


/*お問い合わせボタン*/
.contents-start a.contactbutton{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; margin:40px auto 0 auto;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; box-shadow:0 0 5px #111;}


/*アコーディオン用*/
.accordion-container{position:relative; width:100%; border-top:none; outline:0;}
.accordion-container .article-title{display:block; position:relative; margin:10px 6%; padding:0.75em 3.5em 0.75em 1.25em; font-size:105%; font-weight:bold; background: rgba(12,59,75,1); color:#FFF; cursor:pointer; border-radius:20px;}.accordion-container .article-title p{margin-bottom:0;}
.accordion-container .article-title:hover,
.accordion-container .article-title:active,
.accordion-container .content-entry.open .article-title{background-color:#E0DAC5; color:#111;}
.accordion-container .article-title:hover i:before,
.accordion-container .article-title:hover i:active,
.accordion-container .content-entry.open i{color:#111;}
.article-title{position:relative;}
.article-title a{color:#FFF;}
.article-title:after{content:""; position:absolute; right:25px; top:32%; transition:all 0.2s ease-in-out; display:block; width:8px; height:8px; border-top:solid 4px #FFF; border-right:solid 4px #FFF; -webkit-transform:rotate(135deg); transform:rotate(135deg);}
.article-title.open:after{-webkit-transform:rotate(-45deg); transform:rotate(-45deg); top:45%;}
.accordion-content{margin:10px 6%; padding:0 1.25em 0.75em 1.25em; font-size:100%; display:none; cursor:auto;}
.accordion-content p{margin:0 0 10px 0!important;}
.accordion-container{width:100%; margin:1.875em auto;}
.accordion-content h4 {font-size:125%; margin:20px 0 10px 0;}

/*新着情報*/
ul.newsbox{
	width:100%;
	display:block;
	font-size:85%;
}
ul.newsbox li{
	background:#FFFFCC;
	margin-bottom:1px;
	border-top:1px solid #CC9;
}
ul.newsbox li:nth-child(2n){
	background:#FFF;
}
ul.newsbox li:last-child{
	border-top:1px solid #CC9;
	border-bottom:1px solid #CC9;
}
ul.newsbox li time{
	display:inline-block;
	width:calc(18% - 30px);
	padding:15px;
	font-weight:normal;
	border-right:1px solid #CC9;
}
ul.newsbox li p{
	display:inline-block;
	width:calc(81% - 30px);
	padding:15px;
	margin:0;
}
h3.newstitle{
	line-height:1.5em;
}
time.newstime{
	display:inline-block;
	font-size:90%;
	margin-bottom:10px;
	padding:5px 10px;
	background:rgba(12,59,75,1);
	color:#FFF;
}
ul.article-list{
	width:100%;
	padding:40px 0 15px 0;
	border-top:1px solid #CCC;
	margin-top:50px;
	display:block;
}
ul.article-list li.next,
ul.article-list li.prev{
	width:33%;
	display:block;
	float:left;
}
ul.article-list li.home{
	width:34%;
	display:block;
	float:left;
}
ul.article-list li.next::before{
	content: "<- ";
}
ul.article-list li.prev::after{
	content: " ->";
}
ul.article-list li.next{
	text-align:left;
}
ul.article-list li.home{
	text-align:center;
}
ul.article-list li.prev{
	text-align:right;
}

/*サイトマップ*/
ul.sitemap{
	display:block;
	position:relative;
	width:100%;
	height:730px;
	margin:50px 0 90px 0;
}
ul.sitemap li{
	display:block;
	position:absolute;
}
ul.sitemap li a{
	color:#FFF;
	text-decoration:underline;
}
ul.sitemap li a:hover{
	text-decoration:none;
}
	ul.sitemap li.top-directry{width:calc(100% - 40px); padding:15px 20px; background:rgba(1,88,69,1); color:#FFF; top:0; left:0;}
	ul.sitemap li.top-contents{width:calc(100% - 110px); padding:15px 20px; background:rgba(1,88,69,0.85); color:#FFF;}
		ul.sitemap li.sub-contents01{top:120px; left:140px;}
		ul.sitemap li.sub-contents02{top:165px; left:140px;}
		ul.sitemap li.sub-contents03{top:210px; left:140px;}
		ul.sitemap li.sub-contents04{top:255px; left:140px;}
	ul.sitemap li.cont-no-01{top:60px; left:70px;}
	ul.sitemap li.cont-no-02{top:300px; left:70px;}
		ul.sitemap li.sub-contents05{top:360px; left:140px;}
		ul.sitemap li.sub-contents06{top:405px; left:140px;}
		ul.sitemap li.sub-contents07{top:450px; left:140px;}
	ul.sitemap li.cont-no-03{top:495px; left:70px;}
	ul.sitemap li.cont-no-04{top:555px; left:70px;}
	ul.sitemap li.cont-no-05{top:615px; left:70px;}
	ul.sitemap li.cont-no-06{top:675px; left:70px;}
		ul.sitemap li.sub-contents01,ul.sitemap li.sub-contents02,ul.sitemap li.sub-contents03,ul.sitemap li.sub-contents04,ul.sitemap li.sub-contents05,ul.sitemap li.sub-contents06,ul.sitemap li.sub-contents07{
			width:calc(100% - 170px); font-size:75%; background:rgba(1,88,69,0.7); color:#FFF; padding:10px 15px;
		}


}


/*-------------------------------------------------*/


/*TB版よこレイアウト*/


@media screen and (min-width:769px) and ( max-width:1024px){

main{width:100%; margin:80px auto 0 auto;}


/* ローディング画面 */
#loading {width:100vw; height:100vh; transition:all 1s; background-color:rgba(12,59,75,1); position:fixed; top:0; left:0; z-index:9999; }
.spinner {width:540px; margin:42vh auto;}
.spinner h1{width:100%; text-align:center; color:#FFF; font-size:320%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner p{text-align:center; letter-spacing:1.5em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }
.loaded {animation-name:load; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes load{ 0% { opacity:1;} 33% { opacity:1;} 66% { opacity:1;} 100% {opacity:0; visibility:hidden;} }

.spinner-subcontents {width:720px; margin:42vh auto;}
.spinner-subcontents h1{text-align:center; color:#FFF; font-size:320%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner-subcontents p{text-align:center; letter-spacing:0.4em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }

/*トップページ*/
#first-view {width:100%; height:540px; margin:75px 0 0 0; background:none; position:relative;}
#first-view strong {display:block; width:80%; position:absolute; top:26%; left:10%; font-size:180%; color:#FFF; text-shadow:0px 0px 7px #015845; line-height:1.7em;}
#first-view strong span.comment-top01 {display:inline;}
#first-view strong span.comment-top02 {display:block;}
#first-view p {width:80%; display:block; position:absolute; top:49%; left:10%; font-size:110%; font-weight:bold; color:#111; line-height:2em!important;}
#first-view .scroll {display:block; animation: 2.5s scroll infinite; font-size:140%; font-weight:bold; position:absolute; z-index:3; top:75%; left:47%; color:#015845;}
	@keyframes scroll {0%, 100% {transform: translateY(10px);}50%{transform: translateY(-10px);}}
#first-view span.line01,#first-view span.line02{ display:block; position:relative; width:20px; height:20px; border-top:4px solid #015845; border-right:4px solid #015845; -webkit-transform: rotate(135deg); transform: rotate(135deg);}
#first-view span.line01 {left:20px; top:-6px;}
#first-view span.line02 {left:20px; top:-18px;}

#second-view {width:100%; height:870px; margin:48px 0 125px 0; background:#9FDAD1; position:relative;}
.view-contents {width:100%; margin:0 auto;}

#news {width:calc(85% - 60px); margin:60px auto 80px auto; background:#FFF; border-radius:10px 10px; opacity:0.9; padding:30px 45px 45px 45px;}
#news h2 {text-align:center; font-size:1.5em; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #666;}
#news dt {width:20%; display:inline-block; padding:15px 0; border-bottom:1px solid #BBB; font-size:100%;}
#news dd {width:79%; display:inline-block; padding:15px 0; border-bottom:1px solid #BBB; margin-left:0; font-size:100%;}

/*コンテンツ*/
section{background:#FFF; border-radius:120px 20px; opacity:0.8; position:relative;}
#chapter1 {width:calc(85% - 150px); height:810px; padding:90px; margin:0 auto 90px auto;}
#chapter2 {width:calc(85% - 150px); height:730px; padding:90px; margin:0 auto 90px auto;}
#chapter3 {width:calc(85% - 150px); height:665px; padding:90px; margin:0 auto 90px auto;}
#chapter4 {width:calc(85% - 150px); height:785px; padding:90px; margin:0 auto 90px auto;}

/*セカンドビューグラフ*/
#second-view p.question{padding-top:45px; text-align:center; font-size:130%; font-weight:bold;}
#second-view .chart{padding:30px 0 50px 0; width:380px; margin:0 auto;}
#second-view p.soudan{width:820px; padding-bottom:25px; margin:0 auto; text-align:left; font-size:120%; font-weight:bold;}
#second-view p.soudan span{color:#F33; font-weight:bold;}
#second-view i{position:absolute; top:280px; left:7%; display:block; width:160px; height:150px; padding:30px; background:#F4E6AA; border-radius:10px 10px; font-size:80%; font-style:normal;}
#second-view i a{display:block; font-size:70%; font-weight:bold; font-style:normal; color:#015845; line-height:190%; margin-top:5px;}
#second-view i:before{  content:""; position:absolute;  top:50%; right:-25px; margin-top:-15px; border:15px solid transparent; border-left:15px solid #F4E6AA;}
#second-view p.point{position:absolute; line-height:1.6em; top:280px; right:7%; display:block; width:160px; height:150px; padding:30px; background:#F4E6AA; border-radius:10px 10px; font-size:90%;}
#second-view p.point span{font-weight:bold; color:#F00;}
#second-view p.point:before{  content:""; position:absolute;  top:50%; left:-25px; margin-top:-15px; border:15px solid transparent; border-right:15px solid #F4E6AA;}
#second-view  a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:firstview-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:830px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes firstview-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*画像ディレイ*/

section span.left-image img{position:absolute; top:150px; left:calc(50% - 90px); width:180px; height:180px; border-radius:90px; background:#F9F;
animation-name:imagefade-01; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-01{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }
section span.right-image img{position:absolute; top:150px; right:calc(50% - 90px); width:180px; height:180px; border-radius:90px; background:#F9F;
animation-name:imagefade-02; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-02{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }

/*サービス内コンテンツ*/
section h2{text-align:center; font-size:2.0em; margin-bottom:60px;}
#chapter1 .wrap-contents,#chapter3 .wrap-contents{font-size:90%; margin:220px 0 0 0;}
#chapter2 .wrap-contents,#chapter4 .wrap-contents{font-size:90%; margin:220px 0 0 0;}
.wrap-contents p{margin-bottom:15px; font-size:110%; line-height:2.2em; position:relative; z-index:10;}

/*ボタン*/
#chapter1 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:840px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button01-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter2 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button02-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:790px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button02-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter3 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button03-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:720px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button03-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter4 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button04-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:840px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button04-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*hover*/
#chapter1 a:hover,#chapter2 a:hover,#chapter3 a:hover,#chapter4 a:hover{background:rgba(1,88,69,1); opacity:1; color:#FF0;}


/*内部ページ基本デザイン*/

#contents-service-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage01.jpg) no-repeat center top; z-index:1;}
#contents-about-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage04.jpg) no-repeat center top; z-index:1;}
#contents-support-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage02.jpg) no-repeat center top; z-index:1;}
#contents-contact-view{width:100%; margin:60px 0; position:relative; background:url(../images/contents-titleimage03.jpg) no-repeat center top; z-index:1;}
#contents-service-view h2,#contents-about-view h2,#contents-support-view h2,#contents-contact-view h2{text-align:center; color:#FFF; text-shadow:0px 0px 10px #111;; font-size:220%; position:relative; top:90px; z-index:2;}
.contents-start {width:800px; margin:0 auto; padding:60px; margin:160px auto 70px auto; background-color:rgba(255,255,255,.9); border-radius:15px 15px; z-index:2; }


/*内部ページ詳細*/

.contents-start article{margin:0 0 70px 0;}
.contents-start p{font-size:100%; line-height:1.9em; margin-bottom:20px;}
.contents-start p img{width:180px; height:180px; border-radius:90px 90px; margin:0 auto 45px auto; display:block;}
.contents-start h3{font-size:160%; font-weight:bold; text-align:center; margin:0 0 45px 0; line-height:1.2em;}
.contents-start h3 span{border-bottom:5px solid rgba(1,88,69,1)}
.contents-start h4{font-size:130%; font-weight:bold; margin:0 0 20px 0; line-height:1.3em;}
.contents-start section.works-contents{display:block; padding:30px; margin-bottom:40px; background-color:#FF8; border-radius:30px;}
.contents-start .supplement{font-size:80%; margin-bottom:0;}
.contents-start ul.works-common{margin:0 0 20px 0;}
.contents-start ul.works-common li{font-size:100%; display:block; background:#FFF; padding:10px 15px; margin-bottom:15px; font-weight:bold; position:relative; font-size:95%; width:calc(100% - 30px);}
.contents-start ul.works-common li span{position:absolute; display:inline-block; top:0; right:0; color:#FFF; padding:10px 20px; background:#015845; font-size:80%; text-align:center; width:140px; cursor:pointer;}

.contents-start ul.point{display:block; margin:20px 0 30px 0;}
.contents-start ul.point li{display:block; margin-bottom:10px; position:relative;}
.contents-start ul.point li.pointif-01{background:#FFA;}
.contents-start ul.point li.pointif-02{background:#EE9;}
.contents-start ul.point li.pointif-03{background:#DD8;}
.contents-start ul.point li.pointif-04{background:#C6C677;}
.contents-start ul.point li.pointif-05{background:#BB5;}
.contents-start ul.point li p{display:block; position:absolute; width:calc(100% - 130px); margin:0; top:6px; left:127px; font-size:80%; line-height:1.4em; padding:0;}
.contents-start ul.point li span{display:inline-block; width:90px; padding:13px 14px; margin-right:15px; font-weight:bold; font-size:130%; background:#015845; color:#FFF;}

.contents-start .chart-set{width:360px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set h4{text-align:center; width:600px; margin:0 -120px 20px -120px; font-size:95%;}
.contents-start .chart-set2{width:80%; height:440px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set2 h4{text-align:center; width:600px; margin:0 -120px 20px -120px; font-size:95%;}
.contents-start ul.service-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.service-point li{display:block; background:#FF8; font-size:50%; margin-bottom:10px;}
.contents-start ul.service-point li p{display:inline-block; margin:0;}
.contents-start ul.service-point li span{display:inline-block; padding:13px 14px; font-weight:bold; font-size:140%; background:#015845; color:#FFF;}
.contents-start ul.service-point li strong{display:inline-block; padding:13px 8px; font-weight:bold; font-size:120%; margin-right:0;}
.contents-start ul.assignment-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.assignment-point li{display:block; padding:10px; font-weight:bold; font-size:110%; background:#015845; color:#FFF; margin-bottom:10px;}

article .arrow{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow:before{
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-top: 15px solid #EEE;  /* 好みで色を変えてください */ 
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
}
article .arrow-last{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow dt,
article .arrow-last dt{
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;
}
.extra-margin{margin-bottom:50px!important;}

/*スワイプ用*/
.swiper {
    width: 90%;
    height: 450px;
    border:1px solid #aaa;
    border-radius: 10px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
    .selfcheck-contents strong{
        font-size:200%;
        padding:130px 0 50px 0;
        display:block;
    }
    .selfcheck-contents p{
	width:80%;
	margin:0 10% 30px 10%;
        display:block;
	font-size:130%;
	line-height:1.5em;
    }
    .selfcheck-contents .radiobox{
	margin:0 auto 50px auto;
        display:block;
	width:330px;
    }
    .selfcheck-contents input[type=radio] {
	display:none;
	}
    .selfcheck-contents input[type=radio]:checked + label {
	background:#31A9EE;
	color:#ffffff;
	}

    .label:hover {
	background-color:#E2EDF9;
	}
    .selfcheck-contents .label {
	display:block;
	float:left;
	font-size:130%;
	margin:10px;
	width:120px;
	height:60px;
	padding:0 10px;
	color:#b20000;
	text-align:center;
	line-height:60px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
}
    .selfcheck-end strong{
        font-size:200%;
        padding:100px 0 50px 0;
        display:block;
    }
    .selfcheck-end p{
	width:80%;
	margin:0 10% 30px 10%;
        display:block;
	font-size:130%;
	line-height:1.5em;
    }
    .selfcheck-end input[type=submit] {
	display:block;
	font-size:130%;
	width:120px;
	height:60px;
	padding:0 10px;
	margin:0 auto;
	color:#b20000;
	text-align:center;
	line-height:60px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
	}
    .selfcheck-end input[type=submit]:hover {
	background:#31A9EE;
	color:#ffffff;
	}
	#answer{
	display:block;
	text-align:center;
	font-weight:bold;
	position:relative;
	padding:30px;
	width:calc(90% - 60px);
	border-radius:10px;
	margin:20px auto 45px auto;
	background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%);
	font-size:1.5em;
	color:#FFF;}
		#answer::after{
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		border-top: 30px solid rgba(1,88,69,1);
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		}


/*お問い合わせボタン*/
.contents-start a.contactbutton{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; margin:40px auto 0 auto;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; box-shadow:0 0 5px #111;}


/*アコーディオン用*/
.accordion-container{position:relative; width:100%; border-top:none; outline:0;}
.accordion-container .article-title{display:block; position:relative; margin:10px 6%; padding:0.75em 3.5em 0.75em 1.25em; font-size:105%; font-weight:bold; background: rgba(12,59,75,1); color:#FFF; cursor:pointer; border-radius:20px;}.accordion-container .article-title p{margin-bottom:0;}
.accordion-container .article-title:hover,
.accordion-container .article-title:active,
.accordion-container .content-entry.open .article-title{background-color:#E0DAC5; color:#111;}
.accordion-container .article-title:hover i:before,
.accordion-container .article-title:hover i:active,
.accordion-container .content-entry.open i{color:#111;}
.article-title{position:relative;}
.article-title a{color:#FFF;}
.article-title:after{content:""; position:absolute; right:25px; top:32%; transition:all 0.2s ease-in-out; display:block; width:8px; height:8px; border-top:solid 4px #FFF; border-right:solid 4px #FFF; -webkit-transform:rotate(135deg); transform:rotate(135deg);}
.article-title.open:after{-webkit-transform:rotate(-45deg); transform:rotate(-45deg); top:45%;}
.accordion-content{margin:10px 6%; padding:0 1.25em 0.75em 1.25em; font-size:100%; display:none; cursor:auto;}
.accordion-content p{margin:0 0 10px 0!important;}
.accordion-container{width:100%; margin:1.875em auto;}
.accordion-content h4 {font-size:125%; margin:20px 0 10px 0;}

/*新着情報*/
ul.newsbox{
	width:100%;
	display:block;
	font-size:110%;
}
ul.newsbox li{
	background:#FFFFCC;
	margin-bottom:1px;
	border-top:1px solid #CC9;
}
ul.newsbox li:nth-child(2n){
	background:#FFF;
}
ul.newsbox li:last-child{
	border-top:1px solid #CC9;
	border-bottom:1px solid #CC9;
}
ul.newsbox li time{
	display:inline-block;
	width:calc(23% - 30px);
	padding:15px;
	font-weight:normal;
	border-right:1px solid #CC9;
}
ul.newsbox li p{
	display:inline-block;
	width:calc(75% - 30px);
	padding:15px;
	margin:0;
}
h3.newstitle{
	line-height:1.5em;
}
time.newstime{
	display:inline-block;
	font-size:90%;
	margin-bottom:10px;
	padding:5px 10px;
	background:rgba(12,59,75,1);
	color:#FFF;
}
ul.article-list{
	width:100%;
	padding:40px 0 15px 0;
	border-top:1px solid #CCC;
	margin-top:50px;
	display:block;
}
ul.article-list li.next,
ul.article-list li.prev{
	width:33%;
	display:block;
	float:left;
}
ul.article-list li.home{
	width:34%;
	display:block;
	float:left;
}
ul.article-list li.next::before{
	content: "<- ";
}
ul.article-list li.prev::after{
	content: " ->";
}
ul.article-list li.next{
	text-align:left;
}
ul.article-list li.home{
	text-align:center;
}
ul.article-list li.prev{
	text-align:right;
}

/*サイトマップ*/
ul.sitemap{
	display:block;
	position:relative;
	width:70%;
	height:730px;
	margin:60px 15% 90px 15%;
}
ul.sitemap li{
	display:block;
	position:absolute;
}
ul.sitemap li a{
	color:#FFF;
	text-decoration:underline;
}
ul.sitemap li a:hover{
	text-decoration:none;
}
	ul.sitemap li.top-directry{width:calc(100% - 40px); padding:15px 20px; background:rgba(1,88,69,1); color:#FFF; top:0; left:0;}
	ul.sitemap li.top-contents{width:calc(100% - 110px); padding:15px 20px; background:rgba(1,88,69,0.85); color:#FFF;}
		ul.sitemap li.sub-contents01{top:120px; left:140px;}
		ul.sitemap li.sub-contents02{top:165px; left:140px;}
		ul.sitemap li.sub-contents03{top:210px; left:140px;}
		ul.sitemap li.sub-contents04{top:255px; left:140px;}
	ul.sitemap li.cont-no-01{top:60px; left:70px;}
	ul.sitemap li.cont-no-02{top:300px; left:70px;}
		ul.sitemap li.sub-contents05{top:360px; left:140px;}
		ul.sitemap li.sub-contents06{top:405px; left:140px;}
		ul.sitemap li.sub-contents07{top:450px; left:140px;}
	ul.sitemap li.cont-no-03{top:495px; left:70px;}
	ul.sitemap li.cont-no-04{top:555px; left:70px;}
	ul.sitemap li.cont-no-05{top:615px; left:70px;}
	ul.sitemap li.cont-no-06{top:675px; left:70px;}
		ul.sitemap li.sub-contents01,ul.sitemap li.sub-contents02,ul.sitemap li.sub-contents03,ul.sitemap li.sub-contents04,ul.sitemap li.sub-contents05,ul.sitemap li.sub-contents06,ul.sitemap li.sub-contents07{
			width:calc(100% - 170px); font-size:75%; background:rgba(1,88,69,0.7); color:#FFF; padding:10px 15px;
		}


}


/*-------------------------------------------------*/


/*PC版レイアウト*/


@media screen and (min-width:1025px){

main{width:1080px; margin:80px auto 0 auto;}

/* ローディング画面 */
#loading {width:100vw; height:100vh; transition:all 1s; background-color:rgba(12,59,75,1); position:fixed; top:0; left:0; z-index:9999; }
.spinner {width:540px; margin:42vh auto;}
.spinner h1{width:100%; text-align:center; color:#FFF; font-size:320%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner p{text-align:center; letter-spacing:1.5em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }
.loaded {animation-name:load; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes load{ 0% { opacity:1;} 33% { opacity:1;} 66% { opacity:1;} 100% {opacity:0; visibility:hidden;} }

.spinner-subcontents {width:720px; margin:42vh auto;}
.spinner-subcontents h1{text-align:center; color:#FFF; font-size:320%; animation-name:title-01; animation-duration:2s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-01{ from {opacity:0;}to {opacity:1;} }
.spinner-subcontents p{text-align:center; letter-spacing:0.4em; color:#FFF; margin-top:10px; animation-name:title-02; animation-duration:1s; animation-fill-mode:forwards; opacity:0;}
@keyframes title-02{ from {opacity:0; transform:translateY(30px);}to {opacity:1; translateY(0px);} }


/*トップページ*/
#first-view {width:100%; height:600px; margin:75px 0 0 0; background:none; position:relative;}
#first-view strong {display:block; width:80%; position:absolute; top:33%; left:10%; font-size:200%; color:#FFF; text-shadow:0px 0px 7px #015845; line-height:1.6em;}
#first-view strong span.comment-top01 {display:inline;}
#first-view strong span.comment-top02 {display:block;}
#first-view p {width:80%; display:block; position:absolute; top:53%; left:10%; font-size:130%; font-weight:bold; color:#111; line-height:1.8em!important;}
#first-view .scroll {display:block; animation: 2.5s scroll infinite; font-size:140%; font-weight:bold; position:absolute; z-index:3; top:75%; left:47%; color:#015845;}
	@keyframes scroll {0%, 100% {transform: translateY(10px);}50%{transform: translateY(-10px);}}
#first-view span.line01,#first-view span.line02{ display:block; position:relative; width:20px; height:20px; border-top:4px solid #015845; border-right:4px solid #015845; -webkit-transform: rotate(135deg); transform: rotate(135deg);}
#first-view span.line01 {left:20px; top:-6px;}
#first-view span.line02 {left:20px; top:-18px;}

#second-view {width:100%; height:830px; margin:75px 0 125px 0; background:#9FDAD1; position:relative;}
#second-view h2{display:block; background:#015845; font-size:155%; color:#FFF; text-align:center; padding:15px 0; width:100%; position:relative; margin:0;}
.view-contents {width:1080px; margin:0 auto;}

#news {width:880px; margin:60px auto 80px auto; background:#FFF; border-radius:10px 10px; opacity:0.85; padding:30px 45px 45px 45px;}
#news h2 {text-align:center; font-size:1.5em; margin-bottom:20px; padding-bottom:10px; border-bottom:1px solid #666;}
#news dt {width:220px; display:inline-block; padding:15px 0; border-bottom:1px solid #BBB; font-size:100%;}
#news dd {width:650px; display:inline-block; padding:15px 0; border-bottom:1px solid #BBB; margin-left:0; font-size:100%;}

/*コンテンツ*/
section{background:#FFF; border-radius:120px 20px; position:relative;}
#chapter1,#chapter2,#chapter3,#chapter4 {width:calc(100% - 180px); height:625px; padding:90px; margin-bottom:90px;}
#chapter1{height:695px;}
#chapter2{height:695px;}
#chapter3{height:625px;}
#chapter4{height:715px;}

/*セカンドビューグラフ*/
#second-view p.question{padding-top:45px; text-align:center; font-size:130%; font-weight:bold;}
#second-view .chart{padding:30px 0 50px 0; width:380px; margin:0 auto;}
#second-view p.soudan{width:960px; padding-bottom:25px; text-align:left; font-size:115%; font-weight:bold;}
#second-view p.soudan span{color:#F33; font-weight:bold;}
#second-view i{position:absolute; top:310px; left:7%; display:block; width:240px; height:110px; padding:30px; background:#F4E6AA; border-radius:10px 10px; font-size:80%; font-style:normal;}
#second-view i a{display:block; font-size:70%; font-weight:bold; font-style:normal; color:#015845; line-height:190%; margin-top:5px;}
#second-view i:before{  content:""; position:absolute;  top:50%; right:-25px; margin-top:-15px; border:15px solid transparent; border-left:15px solid #F4E6AA;}
#second-view p.point{position:absolute; line-height:1.6em; top:310px; right:7%; display:block; width:240px; height:110px; padding:30px; background:#F4E6AA; border-radius:10px 10px; font-size:90%;}
#second-view p.point span{font-weight:bold; color:#F00;}
#second-view p.point:before{  content:""; position:absolute;  top:50%; left:-25px; margin-top:-15px; border:15px solid transparent; border-right:15px solid #F4E6AA;}
#second-view  a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:firstview-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:790px; left:calc(50% - 190px);
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes firstview-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*画像ディレイ*/
section span.left-image img{position:absolute; top:90px; left:90px; width:240px; height:240px; border-radius:120px; background:#F9F;
animation-name:imagefade-01; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-01{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }
section span.right-image img{position:absolute; top:90px; right:90px; width:240px; height:240px; border-radius:120px; background:#F9F;
animation-name:imagefade-02; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes imagefade-02{ from {opacity:0; transform:translateY(40px);}to {opacity:1; translateY(0px);} }

/*サービス内コンテンツ*/
section h2{text-align:center; font-size:2.0em; margin-bottom:60px;}
#chapter1 .wrap-contents,#chapter3 .wrap-contents{margin:0 0 0 280px; font-size:90%;}
#chapter2 .wrap-contents,#chapter4 .wrap-contents{margin:0 280px 0 0px; font-size:90%;}
.wrap-contents p{margin-bottom:15px; line-height:2.2em; font-size:110%; position:relative; z-index:10;}

/*ボタン*/
#chapter1 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:720px;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button01-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter2 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button02-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:740px; right:340px;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button02-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter3 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button03-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:670px;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button03-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

#chapter4 a.buttondesign{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; animation-name:button04-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:760px; right:340px;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button04-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }

/*hover*/
#chapter1 a:hover,#chapter2 a:hover,#chapter3 a:hover,#chapter4 a:hover{background:rgba(1,88,69,1); opacity:1; color:#FF0;}


/*内部ページ基本デザイン*/

#contents-service-view{width:100%; margin:75px 0; position:relative; background:url(../images/contents-titleimage01.jpg) no-repeat center top; z-index:1;}
#contents-about-view{width:100%; margin:75px 0; position:relative; background:url(../images/contents-titleimage04.jpg) no-repeat center top; z-index:1;}
#contents-support-view{width:100%; margin:75px 0; position:relative; background:url(../images/contents-titleimage02.jpg) no-repeat center top; z-index:1;}
#contents-contact-view{width:100%; margin:75px 0; position:relative; background:url(../images/contents-titleimage03.jpg) no-repeat center top; z-index:1;}
#contents-service-view h2,#contents-about-view h2,#contents-support-view h2,#contents-contact-view h2{text-align:center; color:#FFF; text-shadow:0px 0px 10px #111; font-size:240%; position:relative; top:90px; z-index:2;}
.contents-start {width:960px; margin:0 auto; padding:60px; margin:160px auto 70px auto; background-color:rgba(255,255,255,.9); border-radius:15px 15px; z-index:2; }

/*内部ページ詳細*/

.contents-start article{margin:0 0 70px 0;}
.contents-start p{font-size:100%; line-height:1.9em; margin-bottom:20px;}
.contents-start p img{width:180px; height:180px; border-radius:90px 90px; margin:0 auto 45px auto; display:block;}
.contents-start h3{font-size:160%; font-weight:bold; text-align:center; margin:0 0 45px 0; line-height:1.2em;}
.contents-start h3 span{border-bottom:5px solid rgba(1,88,69,1)}
.contents-start h4{font-size:130%; font-weight:bold; margin:0 0 10px 0; line-height:1.3em;}
.contents-start section.works-contents{display:block; padding:30px; margin-bottom:40px; background-color:#FF8; border-radius:30px;}
.contents-start .supplement{font-size:80%; margin-bottom:0;}
.contents-start ul.works-common{margin:0 0 20px 0;}
.contents-start ul.works-common li{font-size:100%; display:block; background:#FFF; padding:10px 15px; margin-bottom:15px; font-weight:bold; position:relative; font-size:110%; width:calc(100% - 30px);}
.contents-start ul.works-common li span{position:absolute; display:block; top:0; right:0; color:#FFF; padding:10px 20px; background:#015845; font-size:90%; text-align:center; width:180px; cursor:pointer;}

.contents-start ul.point{display:block; margin:20px 0 30px 0;}
.contents-start ul.point li{display:block; margin-bottom:10px; position:relative;}
.contents-start ul.point li.pointif-01{background:#FFA;}
.contents-start ul.point li.pointif-02{background:#EE9;}
.contents-start ul.point li.pointif-03{background:#DD8;}
.contents-start ul.point li.pointif-04{background:#C6C677;}
.contents-start ul.point li.pointif-05{background:#BB5;}
.contents-start ul.point li p{display:block; position:absolute; width:calc(100% - 140px); margin:0; top:4px; left:140px; font-size:95%; line-height:1.4em; padding:0;}
.contents-start ul.point li span{display:inline-block; width:100px; padding:13px 14px; margin-right:15px; font-weight:bold; font-size:130%; background:#015845; color:#FFF;}

.contents-start .chart-set{width:360px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set h4{text-align:center; width:600px; margin:0 -120px 20px -120px; font-size:95%;}
.contents-start .chart-set2{width:80%; height:440px; margin:50px auto 30px auto; display:block;}
.contents-start .chart-set2 h4{text-align:center; width:600px; margin:0 -120px 20px -120px; font-size:95%;}
.contents-start ul.service-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.service-point li{display:block; background:#FF8; font-size:60%; margin-bottom:10px;}
.contents-start ul.service-point li p{display:inline-block; margin:0; font-size:110%;}
.contents-start ul.service-point li span{display:inline-block; padding:13px 14px; font-weight:bold; font-size:150%; background:#015845; color:#FFF;}
.contents-start ul.service-point li strong{display:inline-block; padding:13px 8px; font-weight:bold; font-size:140%; margin-right:0;}
.contents-start ul.assignment-point{display:block; margin:20px 0 30px 0;}
.contents-start ul.assignment-point li{display:block; padding:10px; font-weight:bold; font-size:110%; background:#015845; color:#FFF; margin-bottom:10px;}

article .arrow{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow:before{
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-top: 15px solid #EEE;  /* 好みで色を変えてください */ 
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
}
article .arrow-last{
    position: relative;
    background: #EEE;  /* 好みで色を変えてください */ 
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}
article .arrow dt,
article .arrow-last dt{
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;
}

.extra-margin{margin-bottom:50px!important;}

/*スワイプ用*/
.swiper {
    width: 90%;
    height: 450px;
    border:1px solid #aaa;
    border-radius: 10px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
    .selfcheck-contents strong{
        font-size:200%;
        padding:130px 0 50px 0;
        display:block;
    }
    .selfcheck-contents p{
	width:80%;
	margin:0 10% 30px 10%;
        display:block;
	font-size:130%;
	line-height:1.5em;
    }
    .selfcheck-contents .radiobox{
	margin:0 auto 50px auto;
        display:block;
	width:330px;
    }
    .selfcheck-contents input[type=radio] {
	display:none;
	}
    .selfcheck-contents input[type=radio]:checked + label {
	background:#31A9EE;
	color:#ffffff;
	}

    .label:hover {
	background-color:#E2EDF9;
	}
    .selfcheck-contents .label {
	display:block;
	float:left;
	font-size:130%;
	margin:10px;
	width:120px;
	height:60px;
	padding:0 10px;
	color:#b20000;
	text-align:center;
	line-height:60px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
}
    .selfcheck-end strong{
        font-size:200%;
        padding:100px 0 50px 0;
        display:block;
    }
    .selfcheck-end p{
	width:80%;
	margin:0 10% 30px 10%;
        display:block;
	font-size:130%;
	line-height:1.5em;
    }
    .selfcheck-end input[type=submit] {
	display:block;
	font-size:130%;
	width:120px;
	height:60px;
	padding:0 10px;
	margin:0 auto;
	color:#b20000;
	text-align:center;
	line-height:60px;
	cursor:pointer;
	border:2px solid #006DD9;
	border-radius:10px;
	}
    .selfcheck-end input[type=submit]:hover {
	background:#31A9EE;
	color:#ffffff;
	}
	#answer{
	display:block;
	text-align:center;
	font-weight:bold;
	position:relative;
	padding:30px;
	width:calc(90% - 60px);
	border-radius:10px;
	margin:20px auto 45px auto;
	background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%);
	font-size:1.5em;
	color:#FFF;}
		#answer::after{
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		border-top: 30px solid rgba(1,88,69,1);
		border-right: 30px solid transparent;
		border-left: 30px solid transparent;
		}

/*お問い合わせボタン*/
.contents-start a.contactbutton{display:block; border-radius:8px; width:380px; padding:15px 0; text-align:center; margin:40px auto 0 auto;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.3em; line-height:1.3em; color:#FFF; font-weight:bold; box-shadow:0 0 5px #111;}


/*アコーディオン用*/
.accordion-container{position:relative; width:100%; border-top:none; outline:0;}
.accordion-container .article-title{display:block; position:relative; margin:10px 6%; padding:0.75em 3.5em 0.75em 1.25em; font-size:105%; font-weight:bold; background: rgba(12,59,75,1); color:#FFF; cursor:pointer; border-radius:20px;}.accordion-container .article-title p{margin-bottom:0;}
.accordion-container .article-title:hover,
.accordion-container .article-title:active,
.accordion-container .content-entry.open .article-title{background-color:#E0DAC5; color:#111;}
.accordion-container .article-title:hover i:before,
.accordion-container .article-title:hover i:active,
.accordion-container .content-entry.open i{color:#111;}
.article-title{position:relative;}
.article-title a{color:#FFF;}
.article-title:after{content:""; position:absolute; right:25px; top:32%; transition:all 0.2s ease-in-out; display:block; width:8px; height:8px; border-top:solid 4px #FFF; border-right:solid 4px #FFF; -webkit-transform:rotate(135deg); transform:rotate(135deg);}
.article-title.open:after{-webkit-transform:rotate(-45deg); transform:rotate(-45deg); top:45%;}
.accordion-content{margin:10px 6%; padding:0 1.25em 0.75em 1.25em; font-size:100%; display:none; cursor:auto;}
.accordion-content p{margin:0 0 10px 0!important;}
.accordion-container{width:100%; margin:1.875em auto;}
.accordion-content h4 {font-size:125%; margin:20px 0 10px 0;}


/*新着情報*/
ul.newsbox{
	width:100%;
	display:block;
	font-size:110%;
}
ul.newsbox li{
	background:#FFFFCC;
	margin-bottom:1px;
	border-top:1px solid #CC9;
}
ul.newsbox li:nth-child(2n){
	background:#FFF;
}
ul.newsbox li:last-child{
	border-top:1px solid #CC9;
	border-bottom:1px solid #CC9;
}
ul.newsbox li time{
	display:inline-block;
	width:calc(23% - 30px);
	padding:15px;
	font-weight:normal;
	border-right:1px solid #CC9;
}
ul.newsbox li p{
	display:inline-block;
	width:calc(75% - 30px);
	padding:15px;
	margin:0;
}
h3.newstitle{
	line-height:1.5em;
}
time.newstime{
	display:inline-block;
	font-size:90%;
	margin-bottom:10px;
	padding:5px 10px;
	background:rgba(12,59,75,1);
	color:#FFF;
}
ul.article-list{
	width:100%;
	padding:40px 0 15px 0;
	border-top:1px solid #CCC;
	margin-top:50px;
	display:block;
}
ul.article-list li.next,
ul.article-list li.prev{
	width:33%;
	display:block;
	float:left;
}
ul.article-list li.home{
	width:34%;
	display:block;
	float:left;
}
ul.article-list li.next::before{
	content: "<- ";
}
ul.article-list li.prev::after{
	content: " ->";
}
ul.article-list li.next{
	text-align:left;
}
ul.article-list li.home{
	text-align:center;
}
ul.article-list li.prev{
	text-align:right;
}

/*サイトマップ*/
ul.sitemap{
	display:block;
	position:relative;
	width:70%;
	height:730px;
	margin:80px 15% 120px 15%;
}
ul.sitemap li{
	display:block;
	position:absolute;
}
ul.sitemap li a{
	color:#FFF;
	text-decoration:underline;
}
ul.sitemap li a:hover{
	text-decoration:none;
}
	ul.sitemap li.top-directry{width:calc(100% - 40px); padding:15px 20px; background:rgba(1,88,69,1); color:#FFF; top:0; left:0;}
	ul.sitemap li.top-contents{width:calc(100% - 110px); padding:15px 20px; background:rgba(1,88,69,0.85); color:#FFF;}
		ul.sitemap li.sub-contents01{top:120px; left:140px;}
		ul.sitemap li.sub-contents02{top:165px; left:140px;}
		ul.sitemap li.sub-contents03{top:210px; left:140px;}
		ul.sitemap li.sub-contents04{top:255px; left:140px;}
	ul.sitemap li.cont-no-01{top:60px; left:70px;}
	ul.sitemap li.cont-no-02{top:300px; left:70px;}
		ul.sitemap li.sub-contents05{top:360px; left:140px;}
		ul.sitemap li.sub-contents06{top:405px; left:140px;}
		ul.sitemap li.sub-contents07{top:450px; left:140px;}
	ul.sitemap li.cont-no-03{top:495px; left:70px;}
	ul.sitemap li.cont-no-04{top:555px; left:70px;}
	ul.sitemap li.cont-no-05{top:615px; left:70px;}
	ul.sitemap li.cont-no-06{top:675px; left:70px;}
		ul.sitemap li.sub-contents01,ul.sitemap li.sub-contents02,ul.sitemap li.sub-contents03,ul.sitemap li.sub-contents04,ul.sitemap li.sub-contents05,ul.sitemap li.sub-contents06,ul.sitemap li.sub-contents07{
			width:calc(100% - 170px); font-size:75%; background:rgba(1,88,69,0.7); color:#FFF; padding:10px 15px;
		}



}





/*********************************************************************
フォーム部分コンテンツ
*********************************************************************/


/*スマホ版レイアウト*/

@media screen and (max-width:600px){

/*フォームデータ*/
.formstart{margin:-15px 0 20px 0; font-size:70%;}
.formconfirm{margin:-10px 0 30px 0; font-size:90%; padding:20px; background:#FFF; border-radius:8px;}
ul.error_list{margin:-20px 0 15px 0; padding:0; }
ul.error_list li{display:inline-block; font-size:60%; font-weight:bold; color:#EB0000; background:#FFFB95; padding:2px 5px; border-radius:4px; margin:0 3px 3px 0}
form dl{margin:0 0 10px 0;}
form dl.telzone{display:block; margin:10px auto;}
form dd{margin:0;}
form dt{font-size:110%; font-weight:bold; margin-bottom:5px;}
form dt span{font-size:60%; font-weight:bold; color:#F20906; padding-left:5px;}

form div.kingaku-wrapper input.buy_money{background:none; border:none; outline:none; padding:0 20px 20px 0; font-size:150%; color:#AA2222;}

form dd input[type="text"]{padding:7px 10px; font-size:80%; width:calc(100% - 8px); border-radius:5px; border:1px solid #015845;}
form dd input.posts{padding:7px 10px; margin-bottom:10px; font-size:80%; width:80px!important; border-radius:5px; border:1px solid #015845;}
form dd input:focus[type="text"]{background:#FFFDC8;}
form dd.notice{font-size:55%; color:#EB0000; line-height:140%; margin-top:10px;}
form dd input[type="tel"]{padding:7px 10px; margin:0 5px; font-size:80%; width:55px; border-radius:5px; border:1px solid #015845;}
form dd input:focus[type="tel"]{background:#FFFDC8;}
form input.require{animation:1.0s require infinite;}
@keyframes require {from {background:#FFF;}to {background:#FFFB95;}}
form input[type="submit"].conf {display:block; border-radius:8px; width:300px; animation-name:package01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; margin:0 auto; padding:15px 0; text-align:center;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:0.95em; letter-spacing:0.07em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #555; margin-top:25px; margin-bottom:-15px;}
@keyframes package01-fade{ from {opacity:0; transform:translateY(50px);}to {opacity:1; translateY(0px);} }
form input[type="submit"].submitbtn, form input[type="submit"].backbtn {display:inline-block; border-radius:8px; animation-name:package02-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; margin:0 2%; text-align:center;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:0.95em; letter-spacing:0.07em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #555; margin-top:40px;}
@keyframes package02-fade{ from {opacity:0; transform:translateY(50px);}to {opacity:1; translateY(0px);} }
form input[type="submit"].submitbtn{width:58%; padding:15px 0;}
form input[type="submit"].backbtn{width:30%; padding:10px 0; font-size:80%; background:linear-gradient(0deg, rgba(99,99,99,1) 3%, rgba(140,140,140,1) 42%, rgba(190,190,190,1) 100%)!important;}
form input[type="submit"]:hover{opacity:0.7;}

form select{padding:7px 10px; margin-bottom:10px; border-radius:10px;font-size:90%; font-weight:bold; width:100%; border:1px solid #015845;}
form select.require02{animation:1.0s require02 infinite;}
@keyframes require02 {from {background:#FFF;}to {background:#FFFB95;}}
form select:focus{background:#FFFDC8;}

form div.kingaku-wrapper input.buy_money{background:none; border:none; outline:none; padding:0 20px 20px 0; width:calc(100% - 20px); font-size:240%; font-weight:bold; color:#AA2222;}
form div.kingaku-wrapper p{font-size:110%; font-weight:bold; margin:20px 0 5px 0;}
form div.kingaku-wrapper p span{font-size:70%; font-weight:bold; color:#F20906; padding-left:5px;}
form div.kingaku-wrapper .money-sheet{padding:1px 25px; margin:20px; border-radius:15px; background:linear-gradient(0deg, rgba(255,248,167,1) 3%, rgba(255,248,167,.7) 22%, rgba(255,222,167,.5) 100%);}
form dt i{font-size:60%; font-weight:bold; color:#111111; padding-left:5px; line-height:110%;}
form hr{margin:40px 0; border:1px dashed #666;}
form p.comment-koumoku{font-size:75%; margin-bottom:25px; text-align:center;}
form textarea{width:calc(100% - 30px); height:4em; font-size:100%; padding:15px; border-radius:15px; border:1px solid #015845;}
form h3.koumoku{margin-bottom:20px; text-align:center; font-size:150%;}
form dd input[type="radio"]{padding:8px; width:24px; height:24px; margin:0 5px 0 10px;}

form textarea.require{animation:1.0s require-ta infinite;}
@keyframes require-ta {from {background:#FFF;}to {background:#FFFB95;}}

form dt.checktitle{font-size:90%; font-weight:bold; margin-bottom:5px; padding:5px 10px; background:#736241; box-shadow:0 0 5px #555; border-radius:0 8px 8px 0; color:#FFF;}
form dd.check{padding:5px 0 0 20px;}

form h3.formtitle{display:block; margin:-10px 0 30px 0; font-size:140%; padding:10px 30px; background:#736241; border-radius:8px; color:#FFF;}
form h3.formtitle2{display:block; margin:30px 0; font-size:140%; padding:10px 30px; background:#736241; border-radius:8px; color:#FFF;}
form p.shikibetsu{ display:block; font-size:110%; font-weight:bold; text-align:center; padding:15px 3%; width:74%; margin:0 10% 30px 10%; background:#FFF;}
form p.shikibetsu span{color:#EB0000;}
form p.comments{ font-size:80%;}
form h3.flow{display:block; margin:30px 0 10px 0; font-size:110%; padding:10px 30px; background:#FFF; border-radius:8px;}
form a.backbt {display:block; border-radius:8px; width:280px; animation-name:package01-fade; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0; margin:0 auto; padding:12px 0; text-align:center;
background:linear-gradient(0deg, rgba(158,32,91,1) 3%, rgba(208,51,121,1) 42%, rgba(215,150,192,1) 100%); font-size:0.95em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #555; margin-top:25px;}

form h3.flow1,form h3.flow2{display:block; margin:30px 0 10px 0; font-size:110%; padding:10px 30px; background:#FFF; border-radius:8px;}
div#box button.contents01{display:block; border-radius:8px; width:260px; height:60px; animation-name:button01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:160px;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.2em; line-height:1.2em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button01-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }
div#box button.contents01:hover{opacity:0.7;}

form ol{margin-left:40px; font-size:13px;}
}


/*PC*/

@media screen and (min-width:601px){

/*フォームデータ*/
.formstart{margin-bottom:40px; font-size:80%;}
.formconfirm{margin:-10px 0 30px 0; font-size:100%; padding:20px 30px; background:#FFF; border-radius:8px;}
ul.error_list{margin:-20px 0 15px 0; padding:0; }
ul.error_list li{display:inline-block; font-size:60%; font-weight:bold; color:#EB0000; background:#FFFB95; padding:2px 5px; border-radius:4px; margin:0 3px 3px 0}
form dl{margin:0 0 15px 0;}
form dl.telzone{display:block; margin:10px auto;}
form dd{margin:0 0 20px 0;}
form dt{font-size:110%; font-weight:bold; margin-bottom:5px;}
form dt span{font-size:70%; font-weight:bold; color:#F20906; padding-left:5px;}


form dd input[type="text"]{padding:8px; font-size:80%; width:calc(100% - 16px); border-radius:5px; border:1px solid #015845;}
form dd input.posts{padding:8px; font-size:80%; width:80px!important; border-radius:5px; border:1px solid #015845;}
form dd input:focus[type="text"]{background:#FFFDC8;}
form dd.notice{font-size:60%; color:#EB0000; line-height:140%; margin-top:-15px; font-weight:bold;}
form dd input[type="tel"]{padding:8px; margin:0 8px; font-size:80%; width:65px; border-radius:5px; border:1px solid #015845;}
form dd input:focus[type="tel"]{background:#FFFDC8;}
form input.require{animation:1.0s require infinite;}
@keyframes require {from {background:#FFF;}to {background:#FFFB95;}}
form input[type="submit"].conf {display:block; border-radius:8px; width:400px; animation-name:package01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; margin:0 auto; padding:20px 0; text-align:center;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:0.95em; letter-spacing:0.07em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #555; margin-top:40px;}
@keyframes package01-fade{ from {opacity:0; transform:translateY(50px);}to {opacity:1; translateY(0px);} }
form input[type="submit"].submitbtn, form input[type="submit"].backbtn {display:inline-block; border-radius:8px; animation-name:package02-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; margin:0 2%; text-align:center;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:0.95em; letter-spacing:0.07em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #555; margin-top:40px;}
@keyframes package02-fade{ from {opacity:0; transform:translateY(50px);}to {opacity:1; translateY(0px);} }
form input[type="submit"].submitbtn{width:58%; padding:15px 0;}
form input[type="submit"].backbtn{width:30%; padding:10px 0; font-size:80%; background:linear-gradient(0deg, rgba(99,99,99,1) 3%, rgba(140,140,140,1) 42%, rgba(190,190,190,1) 100%)!important;}
form input[type="submit"]:hover{opacity:0.7;}

form select{padding:8px 10px; border-radius:10px;font-size:115%; font-weight:bold; width:450px; border:1px solid #015845;}
form select.require02{animation:1.0s require02 infinite;}
@keyframes require02 {from {background:#FFF;}to {background:#FFFB95;}}
form select:focus{background:#FFFDC8;}

form div.kingaku-wrapper input.buy_money{background:none; border:none; outline:none; padding:0 0 20px 0; width:120px; font-size:240%; font-weight:bold; color:#AA2222;}
form div.kingaku-wrapper p{font-size:110%; font-weight:bold; margin:20px 0 5px 0;}
form div.kingaku-wrapper p span{font-size:70%; font-weight:bold; color:#F20906; padding-left:5px;}
form div.kingaku-wrapper .money-sheet{padding:1px 25px; margin:20px; border-radius:15px; background:linear-gradient(0deg, rgba(255,248,167,1) 3%, rgba(255,248,167,.7) 22%, rgba(255,222,167,.5) 100%);}
form dt i{font-size:70%; font-weight:bold; color:#111111; padding-left:5px;}
form hr{margin:40px 0; border:1px dashed #666;}
form p.comment-koumoku{font-size:90%; margin-bottom:25px; text-align:center;}
form textarea{width:calc(100% - 30px); height:3em; font-size:180%; padding:15px; border-radius:15px; border:1px solid #015845;}
form h3.koumoku{margin-bottom:20px; text-align:center; font-size:150%;}
form dd input[type="radio"]{padding:8px; width:28px; height:28px; margin:0 5px 0 20px;}

form textarea.require{animation:1.0s require-ta infinite;}
@keyframes require-ta {from {background:#FFF;}to {background:#FFFB95;}}

form dt.checktitle{font-size:90%; font-weight:bold; margin-bottom:5px; padding:5px 10px; background:#736241; box-shadow:0 0 5px #555; border-radius:0 8px 8px 0; color:#FFF;}
form dd.check{padding:5px 0 0 20px;}

form h3.formtitle{display:block; margin:-10px 0 30px 0; font-size:140%; padding:10px 30px; background:#736241; border-radius:8px 8px; color:#FFF;}
form h3.formtitle2{display:block; margin:30px 0; font-size:140%; padding:10px 30px; background:#736241; border-radius:8px; color:#FFF;}
form p.shikibetsu{ display:block; font-size:110%; font-weight:bold; text-align:center; padding:15px 3%; width:74%; margin:0 10% 30px 10%; background:#FFF;}
form p.shikibetsu span{color:#EB0000;}
form p.comments{ font-size:80%;}

form a.backbt {display:block; border-radius:8px; width:300px; animation-name:package01-fade; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0; margin:0 auto; padding:12px 0; text-align:center;
background:linear-gradient(0deg, rgba(158,32,91,1) 3%, rgba(208,51,121,1) 42%, rgba(215,150,192,1) 100%); font-size:0.95em; letter-spacing:0.07em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #555; margin-top:25px;}




form .comment-soufu{text-align:center; margin-bottom:20px; font-size:13px;}

form h3.flow1,form h3.flow2{display:block; margin:30px 0 10px 0; font-size:110%; padding:10px 30px; background:#FFF; border-radius:8px;}
div#box button.contents01{display:block; border-radius:8px; width:380px; height:70px; animation-name:button01-fade; animation-duration:2.5s; animation-fill-mode:forwards; opacity:0; position:absolute; z-index:3; top:180px;
background:linear-gradient(0deg, rgba(1,88,69,1) 26%, rgba(5,130,88,1) 67%, rgba(7,153,99,1) 100%); font-size:1.4em; line-height:1.2em; color:#FFF; font-weight:bold; border:none; cursor:pointer; box-shadow:0 0 5px #111;}
@keyframes button01-fade{ from {opacity:0; transform:translateY(20px);}to {opacity:1; translateY(0px);} }
div#box button.contents01:hover{opacity:0.7;}
form ol{margin-left:40px; font-size:13px;}

}

