@charset  "utf-8";

/*
-----------------
created 2016.09.26
-----------------
up date 2018.03.16
-----------------
table of contents
-----------------
01.container
02.main
03.table
04.txt
05.other
06.profile
07.post
08.column
09.article
10.description
11.searchform
12.section
13.block
14.slider
15.lp
99.animation
100.ripple
*/


/*
01.container
*/
#container {
	float: left;
	width: 100%;
}
.wide#container {
	float: none;
}


/*
02.main
*/
#main {
	padding: 0 330px 0 0;
	text-align: center;
}
.wide #main {
	padding: 0 0 50px;
}
#main h1,
#main h2,
#main h3,
#main h4 {
	font-size: 3em;
	line-height: 1.5;
	padding: 0 30px 10px;
	text-align: center;
}
#main>h1,
#main>h2,
#main>h3,
#main>h4 {
	font-weight: 200;
	padding: 0 30px 30px;
}
#main h1 span,
#main h2 span,
#main h3 span,
#main h4 span {
	font-size: 20px;
	font-weight: 200;
	color: rgb(70,70,70);
	text-transform: capitalize;
	border-top: solid 1px rgb(0,0,0);
	display: inline-block;
	padding: 10px 10px 0;
}

#main p {
	font-size: 1.4em;
	padding: 0 30px 30px;
	text-align: center;
}
#main p.caption {
	font-size: 1em;
	line-height: 1.5;
}
#main p.pad-on {
	padding-bottom: 60px;
}
#main p.pad-no {
	padding-bottom: 0;
}
#main p span {
	font-weight: bold;
}
#main p span.b {
	color: rgb(255,30,30);
}
#main .tL {
	text-align: left;
}
#main .tC {
	text-align: center;
}
#main .tR {
	text-align: right;
}
#main .uppercase {
	text-transform: uppercase;
}
#main .lowercase {
	text-transform: lowercase;
}

#main ol,
#main ul {
	padding: 0 0 30px 60px;
}
#main ol li {
	font-size: 1.4em;
	list-style: decimal outside;
}
#main ul li {
	font-size: 1.4em;
	list-style: disc outside;
}

#main ul.next {
	overflow: hidden;
	padding: 0 0 30px 30px;
}
* html #main ul.next {
	height: 1%;
}
#main ul.next li {
	float: left;
	list-style: none;
	padding: 0 30px 20px 0;
}

#main ul.err li {
	color: rgb(255,30,30);
	font-weight: bold;
}

#main ul.tag {
	text-align: center;
	padding: 0 0 30px;
}
#main ul.tag li {
	display: inline-block;
	font-size: 1.2em;
	padding: 0 5px;
}
#main ul.tag li a {
	display: block;
	text-align: center;
	padding: 5px 10px;
	text-decoration: none;
	background-color: rgba(52,204,224,0.9);
	color: rgb(255,255,255);
}
#main ul.tag li a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

#main ol.point {
	padding: 0 0 40px;
	text-align: center;
}
#main ol.point li {
	background-color: rgb(211, 209, 210);
	color: rgb(50, 50, 50);
	display: inline-block;
	padding: 20px;
	margin: 0 10px 20px;
}
#main ol.point.v2 li {
	width: 400px;
}

#main dl.bnr dt {
	text-align: center;
	font-size: 1.4em;
	padding: 0 0 10px;
}
#main dl.bnr dd ul {
	text-align: center;
	padding: 0;
}
#main dl.bnr dd ul li {
	display: inline-block;
	padding: 0 10px 10px;
	vertical-align: middle;
}

#main .map {
	text-align: center;
	padding: 0 0 30px;
}
#main .map iframe {
	border: solid 1px rgb(204,204,204);
}


/*
03.table
*/
#main table {
	table-layout: fixed;
	margin: 0 auto 40px;
	box-sizing: border-box;
	width: 100%;
}
#main table caption {
	display: none;
}
#main table th,
#main table td {
	border: solid 1px rgb(0,0,0);
	font-size: 1.4em;
}
#main table th {
	background-color: rgb(70,70,70);
	color: rgb(255,255,255);
	padding: 5px 0;
	text-align: center;
	width: 160px;
}
#main table td {
	padding: 10px;
	background-color: rgb(247,247,247);
}
#main table td.tc {
	text-align: center;
}
#main table td ul li,
#main table td ol li {
	font-size: 1em;
}
#main table td input,
#main table td textarea {
	width: 98%;
	border: solid 1px rgb(0,0,0);
	box-sizing: border-box;
	padding: 10px;
	-moz-transition: width .3s;
	-webkit-transition: width .3s;
	-o-transition: width .3s;
	-ms-transition: width .3s;
	transition: width .3s;
	background-color: rgb(255,255,255);
}
#main table td input:focus,
#main table td textarea:focus {
	border: solid 1px rgb(255,165,38);
	outline: none;
	width: 100%;
	background: rgba(255,165,38,0.2);
}

#main table td input:required:valid,
#main table td textarea:required:valid {
	border: solid 1px rgb(64,200,255);
	background: rgba(64,200,255,0.2);
}
#main table td input.finished,
#main table td textarea.finished {
	border: solid 1px rgb(64,200,255);
	background: rgba(64,200,255,0.2);
}
#main table td input:invalid,
#main table td textarea:invalid {
	border: solid 1px rgb(246,82,82);
	background: rgba(246,82,82,0.2);
}

#main table.number th {
	width: auto;
}
#main table.number td {
	text-align: right;
}

#main table.number2 {
	width: 600px;
}
#main table.number2 th,
#main table.number2 td {
	border: solid 1px rgb(120,120,120);
}
#main table.number2 tbody th {
	background-color: rgb(211,209,210);
	color: rgb(70,70,70);
}
#main article table.number2 tbody th {
	width: auto;
}
#main table.number2 td {
	text-align: right;
	background-color: rgb(255,255,255);
}

#main .listview {
	padding: 0 30px;
}
#main table.list3 {
	width: 800px;
}
#main table.list thead th:nth-of-type(1),
#main table.list thead th:nth-of-type(4),
#main table.list2 thead th:nth-of-type(1) {
	width: 40px;
}
#main table.list thead th:nth-of-type(2),
#main table.list thead th:nth-of-type(5),
#main table.list2 thead th:nth-of-type(2),
#main table.list3 thead th:nth-of-type(1) {
	width: 100px;
}
#main table.list tbody th,
#main table.list2 tbody th,
#main table.list3 tbody th {
	background-color: rgb(211,209,210);
	border: solid 1px rgb(120,120,120);
	color: rgb(70,70,70);
}
#main table.list tbody td,
#main table.list2 tbody td,
#main table.list3 tbody td {
	background-color: rgb(255,255,255);
	border: solid 1px rgb(120,120,120);
}


/*
04.txt
*/
#main div.txt,
#main div.map,
#main dl.txt {
	padding: 0 30px;
}
#main dl.txt  dt {
	font-weight: bold;
	font-size: 1.4em;
}
#main dl.txt  dd {
	padding: 0 0 15px;
	font-size: 1.4em;
}
#main dl.txt  dd ul,
#main dl.txt  dd ol {
	padding: 0 0 0 30px;
}
#main dl.txt  dd ul li,
#main dl.txt  dd ol li {
	font-size: 1em;
}


/*
05.other
*/
#main .other dl {
	padding: 0 30px;
}
#main .other dl dt {
	font-size: 1.4em;
}
#main .other dl  dd {
	padding: 0 0 15px;
	font-size: 1.4em;
}


/*
06.profile
*/
#main .profile {
	background-color: rgb(242,242,242);
	padding: 30px;
	overflow: hidden;
	margin: 0 0 20px;
}
* html #main .profile {
	height: 1%;
}
#main .profile p {
	padding: 0 0 20px;
}
#main .profile figure {
	float: left;
	width: 120px;
	padding: 0 20px 0 0 !important;
}
#main .profile dl {
}
#main .profile dl dt {
	font-size: 1.4em;
	font-weight: bold;
	padding: 0;
}
#main .profile dl dd {
	font-size: 1.2em;
	padding: 0 0 10px;
}
#main .profile dl dd.link {
	font-size: 1.4em;
	text-align: right;
}
#main .profile dl dd a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	text-decoration: none;
}


/*
07.post
*/
#main aside h2 {
	border-top: solid 3px rgb(221,221,221);
	border-bottom: solid 1px rgb(221,221,221);
	padding: 30px 0 30px 30px;
	font-size: 2em;
	line-height: 1.5;
	font-weight: 200;
	text-align: left;
}
#main aside .post a {
	display: block;
	color: rgb(33,33,33);
	text-decoration: none;
	border-bottom: solid 1px rgb(221,221,221);
	padding: 20px 30px;
	overflow: hidden;
}
* html #main aside .post a {
	height: 1%;
}
#main aside .post a:last-child {
	border-bottom: none;
}
#main aside .post a.pr {
	background-color: rgba(255,255,30,0.1);
}
#main aside .post a:hover {
	background-color: rgba(0,0,0,0.1);
}
#main aside .post dl {
	position: relative;
	padding: 0 0 0 100px;
	min-height: 80px;
}
#main aside .post dl:last-child {
	border-bottom: none;
}
#main aside .post dl dt {
	padding: 0 0 3px;
	font-size: 1.4em;
	font-weight: bold;
}
#main aside .post dl dd {
	padding: 0 0 5px;
	font-size: 1.2em;
}
#main aside .post dl dd p {
	padding: 0;
	font-size: 1em;
	text-align: left;
}
#main aside .post dl dd.time {
	color: rgb(153,153,153);
	font-size: 1em;
}
#main aside .post dl dd.img {
	position: absolute;
	top: 0;
	left: 0;
	padding: 0;
	width: 80px;
	height: 80px;
	overflow: hidden;
	background: no-repeat 50% 50%;
	background-size: cover;
	-moz-transition: -moz-transform 0.4s ease-out;
	-webkit-transition: -webkit-transform 0.4s ease-out;
	-o-transition: -o-transform 0.4s ease-out;
	-ms-transition: -ms-transform 0.4s ease-out;
	transition: transform 0.4s ease-out;
}
#main aside .post a:hover dl dd.img {
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

#main p.tablenav {
	text-align: center;
}
#main p.tablenav span,
#main p.tablenav a {
	padding: 0 5px;
}


/*
08.column
*/
#main .column {
	overflow: hidden;
	padding: 0 0 50px 30px;
	margin: 0 auto;
}
* html #main .column {
	height: 1%;
}
#main .column.v2 {
	padding: 0 10px;
}
#main .column>a {
	width: 400px;
	height: 230px;
	margin: 0 30px 30px 0;
	color: rgb(50,50,50);
	text-decoration: none;
	display: block;
	position: relative;
	overflow: hidden;
}
#main .column>.fb-page {
	width: 400px;
	height: 230px;
	margin: 0 30px 30px 0;
	background-color: rgb(242,242,242);
	overflow: hidden;
}
#main .column>a::before,
#main .column>a::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 200px;
	height: 230px;
	background-color: rgba(0,0,0,0.8);
	opacity: 0;
	-moz-transition: opacity 0.6s, transform 0.6s;
	-webkit-transition: opacity 0.6s, transform 0.6s;
	-o-transition: opacity 0.6s, transform 0.6s;
	-ms-transition: opacity 0.6s, transform 0.6s;
	transition: opacity 0.6s, transform 0.6s;
}

#main .column>a:hover::before,
#main .column>a:hover::after {
	opacity: 0.9;
	transition-duration: 0.3s;
}
#main .column>a::before {
	-moz-transform: translateX(-175px) skew(-30deg);
	-webkit-transform: translateX(-175px) skew(-30deg);
	-o-transform: translateX(-175px) skew(-30deg);
	-ms-transform: translateX(-175px) skew(-30deg);
	transform: translateX(-175px) skew(-30deg);
}
#main .column>a:hover::before {
	-moz-transform: translateX(0) skew(0);
	-webkit-transform: translateX(0) skew(0);
	-o-transform: translateX(0) skew(0);
	-ms-transform: translateX(0) skew(0);
	transform: translateX(0) skew(0);
}
#main .column>a::after {
	-moz-transform: translateX(300px) skew(-30deg);
	-webkit-transform:  translateX(300px) skew(-30deg);
	-o-transform:  translateX(300px) skew(-30deg);
	-ms-transform:  translateX(300px) skew(-30deg);
	transform:  translateX(300px) skew(-30deg);
}
#main .column>a:hover::after {
	-moz-transform: translateX(200px) skew(0);
	-webkit-transform: translateX(200px) skew(0);
	-o-transform: translateX(200px) skew(0);
	-ms-transform: translateX(200px) skew(0);
	transform: translateX(200px) skew(0);
}

#main .column>a dl {
	margin: 0 0 10px;
	background: rgb(255,255,255) no-repeat 50% 50%;
	background-size: cover;
	height: 210px;
}
#main .column>a dl dt {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1000;
	padding: 5px 10px;
	font-size: 1.4em;
	width: 100%;
	height: 26px;
	box-sizing: border-box;
	background-color: rgb(211, 209, 210);
}
#main .column>a:hover dl {
	display: table;
	width: 100%;
	height: 100%;
}
#main .column>a:hover dl dt {
	position: relative;
	top: 0;
	height: 100%;
	padding: 0 40px;
	font-size: 2em;
	color: rgb(255,255,255);
	background-color: rgba(0,0,0,0.8);
	opacity: 0;
	display: table-cell;
	vertical-align: middle;
	
	-moz-animation: ac_hover 0.3s 0.3s forwards;
	-webkit-animation: ac_hover 0.3s 0.3s forwards;
	-o-animation: ac_hover 0.3s 0.3s forwards;
	-ms-animation: ac_hover 0.3s 0.3s forwards;
	animation: ac_hover 0.3s 0.3s forwards;
}

#main .column>a dl dd.date {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
	display: inline-block;
	font-size: 1em;
	font-weight: bold;
	min-height: inherit;
	text-align: right;
	color: rgb(255,255,255);
	vertical-align: top;
}
#main .column>a dl dd.date span {
	padding: 5px 10px;
	display: block;
	text-align: center;
}
#main .column>a dl dd.date span.d {
	background-color: rgba(0,0,0,0.9);
}
#main .column>a dl dd.date span.c {
	background-color: rgba(52,204,224,0.9);
}


/*
09.article
*/
#main article .head {
	border-top: solid 3px rgb(221,221,221);
	border-bottom: solid 3px rgb(221,221,221);
	padding: 30px 0 30px 30px;
	margin: 0 0 20px;
}
#main article .head h1 {
	font-size: 3em;
	line-height: 1.5;
	font-weight: 200;
	border-bottom: none;
	padding: 0;
	margin: 0;
	text-align: left;
}
#main article .head time {
	font-size: 1.2em;
	padding: 5px 20px 0 0;
}
#main article .head span.cate {
	font-size: 1.2em;
	padding: 5px;
	background-color: rgba(52,204,224,0.9);
	color: rgb(255,255,255);
}
#main article ul.social {
	padding: 0 30px 30px;
	overflow: hidden;
}
* html #main article ul.social {
	height: 1%;
}
#main article ul.social li {
	float: right;
	list-style: none;
	padding: 0 0 0 20px;
	line-height: 1;
}
#main article .txt figure,
#main article .txt .img {
	text-align: center;
	padding: 0 0 50px;
	font-size: 1.2em;
}
#main article .txt figure figcaption {
	text-align: center;
}
#main article .txt h2,
#main article .txt h3,
#main article .txt h4 {
	text-align: left;
	font-size: 2em;
	font-weight: 200;
	background-color: rgb(244,245,246);
	padding: 5px 30px;
	margin: 0 0 10px;
}
#main article .txt p {
	font-size: 1.6em;
	padding: 0 30px 50px;
	text-align: left;
}
#main article .txt p.tC {
	text-align: center;
}
#main article .txt p.tR {
	text-align: right;
}
#main article .txt p span {
	padding: 0 1em 0 0;
	color: rgb(241,106,33);
}
#main article .txt p a {
	word-wrap: break-word;
}
#main article .txt ol li,
#main article .txt ul li {
	font-size: 1.6em;
}
#main article .txt dl dt {
	font-size: 2em;
	font-weight: 200;
	padding: 0 30px 10px;
}
#main article .txt dl dd {
	font-size: 1.6em;
	padding: 0 30px 50px;
}
#main article .txt dl dd ol li,
#main article .txt dl dd ul li {
	font-size: 1em;
}
#main article .txt dl dd .img {
	display: block;
	text-align: center;
	padding: 10px 0;
}
#main article .txt blockquote {
	background-color: rgb(242,242,242);
    padding: 20px 30px;
    margin: 0 0 30px;
}
#main article .txt blockquote p {
	font-style: italic;
	padding: 0;
}
#main article .txt blockquote ol,
#main article .txt blockquote ul {
	padding: 0 0 0 30px;
}
#main article .txt blockquote ol li,
#main article .txt blockquote ul li {
	font-style: italic;
}
#main article .txt code {
	background-color: rgb(242,242,242);
    padding: 20px 30px;
	display: block;
	word-break: break-all;
}


/*
10.description
*/
#main .description {
	overflow: hidden;
	padding: 0 0 50px 30px;
	margin: 0 auto;
}
* html #main .description {
	height: 1%;
}
#main .description>span {
	width: 400px;
	height: 550px;
	margin: 0 30px 30px 0;
/*	background-color: rgb(70,70,70);*/
	background-color: rgb(211, 209, 210);
	color: rgb(50,50,50);
	text-decoration: none;
	display: block;
	position: relative;
	overflow: hidden;
}
#main .description.v3>span {
	height: 450px;
}
#main .description.v4>span {
	height: 380px;
}
#main .description.v5>span {
	height: 300px;
}
#main .description.v6>span {
	height: 320px;
}

#main .description>span dl {
	padding: 0 0 10px;
}
#main .description>span dl dt:not(.label) {
	height: 200px;
	overflow: hidden;
	position: relative;
	background-color: rgb(255,255,255);
}
#main .description.v2>span dl dt:not(.label) {
	height: 260px;
}
#main .description>span dl dt:not(.label) img {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: auto;
	-webkit-transform: translate3d(0, -50%, 0);
	-moz-transform: translate3d(0, -50%, 0);
	-ms-transform: translate(0, -50%);
	transform: translate3d(0, -50%, 0);
	
	-moz-transition: -moz-transform 0.4s ease-out;
	-webkit-transition: -webkit-transform 0.4s ease-out;
	-o-transition: -o-transform 0.4s ease-out;
	-ms-transition: -ms-transform 0.4s ease-out;
	transition: transform 0.4s ease-out;
}
#main .description>span dl dt.label,
#main .description>span dl dd.label {
	padding: 40px 0 40px;
	font-size: 2.6em;
	font-weight: 200;
	border-bottom: solid 1px rgba(255,255,255,0.3);
	margin: 0 10px;
	text-align: center;
}
#main .description>span dl dt.label a,
#main .description>span dl dd.label a {
	color: rgb(50,50,50);
}
#main .description>span dl dt.label a:hover,
#main .description>span dl dd.label a:hover {
	text-decoration: none;
}

#main .description>span dl dd.date {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
	display: inline-block;
	font-size: 1em;
	font-weight: bold;
	min-height: inherit;
	text-align: right;
	color: rgb(255,255,255);
}
#main .description>span dl dd.date span {
	padding: 5px 10px;
	display: block;
	text-align: center;
}
#main .description>span dl dd.date span.d {
	background-color: rgba(0,0,0,0.9);
}
#main .description>span dl dd.date span.c {
	background-color: rgba(255,30,30,0.9);
}

#main .description>span dl dd.txt {
	padding: 30px 20px 0;
	font-size: 1.2em;
}
#main .description>span dl dd.txt ul {
	padding: 5px 0 0 30px;
}
#main .description>span dl dd.txt ul li {
	font-size: 1em;
}


/*
11.searchform
*/
#main #searchform input[type="text"] {
	width: 650px;
	border: solid 1px rgb(204,204,204);
	box-sizing: border-box;
	padding: 10px;
	font-size: 16px;
}
#main #searchform input[type="submit"] {
	box-sizing: border-box;
	padding: 10px;
	font-size: 16px;
	border: 1px solid rgb(51,51,51);
	background-color: rgb(0,0,0);
	color: rgb(255,255,255);
}
#main #searchform input[type="submit"]:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	cursor: pointer;
}


/*
12.section
*/
#main section {
	padding: 50px 0;
	text-align: center;
}
#top #main section:nth-child(2n+2) {
	background-color: rgb(247,247,247);
}
#main section p {
	text-align: left;
	max-width: 1200px;
	margin: 0 auto;
}
#main section figure,
#main section div.img {
	display: inline-block;
	padding: 0 10px 30px;
	vertical-align: top;
	font-size: 1.4em;
	text-align: center;
}
#main section figure img,
#main section div.img img {
	margin: 0 auto 5px;
	display: block;
}
#main section figure figcaption {
	text-align: center;
}
#main section figure p {
	text-align: center;
	padding: 0;
}

#main .seo {
	text-align: center;
}
#main .seo.pad-on {
	padding: 0 0 50px;
}
#main .seo section:first-child {
	padding: 0 0 50px;
}
#main .seo section:nth-child(2n+2) {
	background-color: rgb(247,247,247);
}
#main .seo section h1 {
	background: rgb(211,209,210) url(../../img/seo/bg_seo.jpg) no-repeat 50% 0;
	line-height: 300px;
	font-size: 5em;
	font-weight: 100;
	padding: 0 0 0 100px;
	margin: 0 0 50px;
}
#main .seo.analytics section h1 {
	background: rgb(211,209,210) url(/as/img/analytics/bg_analytics.jpg) no-repeat 50% 0;
}
#main .seo.homepage section h1 {
	background: rgb(211,209,210) url(/as/img/homepage/bg_homepage.jpg) no-repeat 50% 0;
}
#main .seo.sc section h1 {
	background: rgb(211,209,210) url(/as/img/search-console/bg_search-console.jpg) no-repeat 50% 0;
}
#main .seo.web section h1 {
	background: rgb(211,209,210) url(/as/img/top/bg_web.jpg) no-repeat 50% 0;
	padding: 0 0 0 300px;
}
#main .seo h2,
#main .seo h3,
#main .seo h4 {
	font-weight: 200;
	padding: 0 30px 30px;
}
#main .seo dl.txt {
	max-width: 1200px;
	margin: 0 auto 50px;
}


/*
13.block
*/
#main .block {
	overflow: hidden;
	text-align: center;
	padding: 0 0 30px;
}
* html #main .block {
	height: 1%;
}
#main .block dl {
	display: inline-block;
	vertical-align: top;
	width: 300px;
	padding: 0 10px;
}
#main .block dl dt {
	font-size: 2em;
	font-weight: 200;
	text-align: center;
}


/*
14.slider
*/
#slider,
#slider2 {
	width: 100%;
	height: 400px;
	overflow: hidden;
	position:relative;
}
#slider ul li,
#slider2 ul li {
	text-align: center;
}
#slider ul.bg li,
#slider2 ul.bg li {
	width: 400px;
	height: 300px;
	background: no-repeat 50% 50%;
	background-size: cover;
}
#slider ul li a,
#slider2 ul li a {
	position: relative;
	display: block;
	text-decoration: none;
	color: rgb(33,33,33);
}
#slider ul li a:hover,
#slider2 ul li a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}
#slider ul li a::after,
#slider2 ul li a::after {
	content: ">";
	position: absolute;
	bottom: 10px;
	right: 60px;
}
.slide-wrap {
	width: 400px;
	height: 400px;
	margin: 0 auto;
	position: relative;
}
.bx-wrapper {
	max-width: 100%!important;
}
.bx-viewport {
	overflow: visible!important;
}

#slider .bx-pager,
#slider2 .bx-pager {
	padding: 20px 0;
	text-align: center;
	position: relative;
	z-index: 999999;
	width: 100%;
	height: 10px;
}
#slider .bx-pager .bx-pager-item,
#slider2 .bx-pager .bx-pager-item {
	display: inline-block;
	padding: 0 5px;
	font-size: 10px;
	list-style: none;
}
#slider .bx-pager .bx-pager-item a,
#slider2 .bx-pager .bx-pager-item a {
	text-decoration: none;
	display: block;
	width: 11px;
	height: 10px;
	background: url(/as/img/object/ico_circle_non-min.png) no-repeat 50% 0;
	text-indent: -9999px;
}
#slider .bx-pager .bx-pager-item a.active,
#slider2 .bx-pager .bx-pager-item a.active {
	background: url(/as/img/object/ico_circle_point-min.png) no-repeat 50% 0;
}
#slider .bx-controls-direction,
#slider2 .bx-controls-direction {
	display: none;
}


/*
15.lp
*/
#lp section.box02 {
	background: url(/as/img/lp/bg_diagonal.png) repeat 0 0;
	padding: 0 0 40px;
}
#lp section.box02 h2 {
	background-color: rgb(52,204,224);
	text-align: center;
	color: rgb(251,245,88);
	font-size: 3.6em;
	line-height: 1.3;
	position: relative;
	height: 145px;
	margin: 0 0 65px;
	padding: 15px 0 0;
	box-sizing: border-box;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}
#lp section.box02 h2::after {
	content: "";
	display: block;
	background: url(/as/img/lp/bg_arrow2.png) no-repeat 0 0;
	width: 39px;
	height: 33px;
	position: absolute;
	bottom: -33px;
	left: 50%;
	margin-left: -19px;
}
#lp section.box02 h2 .b {
	font-size: 26px;
	color: rgb(255,255,255);
}
#lp section.box02 .board {
	margin: 0 auto 40px;
	background-color: rgb(255,255,255);
	width: 1000px;
	overflow: hidden;
	padding: 0 0 40px;
}
* html #lp section.box02 .board {
	height: 1%;
}
#lp section.box02 .board p {
	font-size: 2.4em;
	line-height: 80px;
	text-align: center;
	color: rgb(255,255,255);
	background-color: rgb(112,112,112);
	margin: 0 0 10px;
}
#lp section.box02 .board p .b {
	color: rgb(52,204,224);
	margin: 0 20px 0 0;
}
#lp section.box02 .board figure {
	float: left;
	width: 560px;
	text-align: right;
	padding: 35px 0 0;
}
#lp section.box02 .board dl {
	float: right;
	width: 350px;
	padding: 0 50px 0 0;
}
#lp section.box02 .board dl dt {
	font-size: 2.4em;
	text-align: center;
	padding: 0 0 10px;
}
#lp section.box02 .board dl dd ul {
	border-top: solid 1px rgb(211,209,210);
	background-color: rgb(244,244,244);
}
#lp section.box02 .board dl dd ul li {
	font-size: 1.8em;
	border-bottom: solid 1px rgb(255,255,255);
	padding: 3px 0 3px 10px;
}
#lp section.box02 .board dl dd ul li::before {
	content: "・";
}

#lp section.box03 {
	background-color: rgb(52,204,224);
	background: -moz-radial-gradient(center, ellipse cover, rgb(139,235,252) 0%,rgb(52,204,224) 100%);
	background: -webkit-radial-gradient(center, ellipse cover, rgb(139,235,252) 0%,rgb(52,204,224) 100%);
	background: radial-gradient(center, ellipse cover, rgb(139,235,252) 0%,rgb(52,204,224) 100%);
	padding: 75px 0 65px;
}
#lp section.box03 h3 {
	text-align: center;
	color: rgb(255,255,255);
	font-size: 4.2em;
	line-height: 1.3;
	padding: 0 0 45px;
}
#lp section.box03 h3 .b {
	font-size: 20px;
}
#lp section.box03 ol {
	position: relative;
}
#lp section.box03 ol::after {
	content: "";
	display: block;
	width: 100%;
	height: 330px;
	background: url(/as/img/lp/repeat.png) no-repeat 50% 0;
	position: absolute;
	bottom: 45px;
	left: 0;
}
#lp section.box03 ol>li {
	font-size: 3.6em;
	padding: 25px 0;
}
#lp section.box03 ol>li div {
	position: relative;
	width: 1000px;
	margin: 0 auto;
	padding: 0 0 0 67px;
	box-sizing: border-box;
}
#lp section.box03 ol>li:nth-child(2n+1) {
	background-color: rgba(255,255,255,0.3);
}
#lp section.box03 ol>li div::before {
	content: "";
	display: block;
	width: 37px;
	position: absolute;
	top: 0;
	left: 0;
}
#lp section.box03 ol>li:nth-of-type(1) div::before {
	background: url(/as/img/lp/no1.png) no-repeat 0 0;
	height: 60px;
}
#lp section.box03 ol>li:nth-of-type(2) div::before {
	background: url(/as/img/lp/no2.png) no-repeat 0 0;
	height: 60px;
}
#lp section.box03 ol>li:nth-of-type(3) div::before {
	background: url(/as/img/lp/no3.png) no-repeat 0 0;
	height: 61px;
}
#lp section.box03 ol>li:nth-of-type(4) div::before {
	background: url(/as/img/lp/no4.png) no-repeat 0 0;
	height: 58px;
}
#lp section.box03 ol>li:nth-of-type(1) div::after,
#lp section.box03 ol>li:nth-of-type(2) div::after,
#lp section.box03 ol>li:nth-of-type(3) div::after {
	content: "";
	display: block;
	width: 41px;
	height: 36px;
	background: url(/as/img/lp/bg_arrow3.png) no-repeat 0 0;
	position: absolute;
	bottom: -43px;
	left: 50%;
	margin-left: -13px;
}
#lp section.box03 ol>li:nth-of-type(1) dl dt {
	float: left;
}
#lp section.box03 dl dd ul {
	display: inline-block;
}
#lp section.box03 ol>li:nth-of-type(1) dl dd ul {
	padding: 0 0 0 30px;
}
#lp section.box03 dl dd ul li {
	font-size: 18px;
}
#lp section.box03 dl dd ul li::before {
	content: "・";
}

#lp section.box04 {
	background: url(/as/img/lp/bg_lineup.jpg) no-repeat 0 0;
	background-size: cover;
	padding: 0 0 60px;
}
#lp section.box04 h4 {
	text-align: center;
	color: rgb(52,204,224);
	background-color: rgb(255,255,255);
	font-size: 4.2em;
	line-height: 1.3;
	padding: 50px 0 60px;
}
#lp section.box04 h4 .b {
	font-size: 20px;
	color: rgb(0,0,0);
}
#lp section.box04 .board {
	width: 1000px;
	margin: 0 auto;
	background-color: rgba(255,255,255,0.8);
	padding: 40px 30px 0;
	box-sizing: border-box;
}
#lp section.box04 .board p {
	font-size: 3.2em;
	text-align: center;
	padding: 0 0 45px;
}
#lp section.box04 .board dl dt {
	font-size: 2.4em;
	line-height: 60px;
	text-align: center;
	color: rgb(255,255,255);
	background-color: rgb(52,204,224);
}
#lp section.box04 .board dl dd {
	padding: 30px 0 40px;
}
#lp section.box04 .board dl dd ul {
	display: table;
	width: 100%;
}
#lp section.box04 .board dl dd ul li {
	font-size: 1.6em;
	line-height: 1.3;
	display: table-cell;
	width: 220px;
	height: 100px;
	text-align: center;
	vertical-align: middle;
	border: solid 2px rgba(255,255,255,0);
	position: relative;
	z-index: 0;
}
#lp section.box04 .board dl dd ul li::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgb(255,255,255);
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}

#lp section.box05 h4 {
	text-align: center;
	color: rgb(52,204,224);
	background-color: rgb(255,255,255);
	font-size: 4.2em;
	line-height: 1.3;
	padding: 50px 0 60px;
}
#lp section.box05 h4 .b {
	font-size: 20px;
	color: rgb(0,0,0);
}
#lp section.box05 dl dt {
	font-size: 1.8em;
	color: rgb(255,255,255);
	background-color: rgb(52,204,224);
	padding: 30px 0 20px;
}
#lp section.box05 dl dd {
	font-size: 1.6em;
	padding: 35px 0 50px;
}
#lp section.box05 dl dt span,
#lp section.box05 dl dd span {
	display: block;
	position: relative;
	width: 1000px;
	margin: 0 auto;
	padding: 0 0 0 100px;
	box-sizing: border-box;
}
#lp section.box05 dl dt span::before {
	content: "";
	display: block;
	width: 34px;
	height: 48px;
	background: url(/as/img/lp/ico_q.png) no-repeat 0 0;
	position: absolute;
	top: -10px;
	left: 35px;
}
#lp section.box05 dl dd span::before {
	content: "";
	display: block;
	width: 34px;
	height: 39px;
	background: url(/as/img/lp/ico_a.png) no-repeat 0 0;
	position: absolute;
	top: -10px;
	left: 35px;
}

#lp section.box06 {
	background-color: rgb(177,229,235);
	padding: 0 0 55px;
}
#lp section.box06 p {
	background-color: rgb(67,67,67);
	text-align: center;
	color: rgb(255,255,255);
	font-size: 3.6em;
	line-height: 1.3;
	position: relative;
	height: 210px;
	margin: 0 0 85px;
	padding: 60px 0 0;
	box-sizing: border-box;
}
#lp section.box06 p::after {
	content: "";
	display: block;
	background: url(/as/img/lp/bg_arrow4.png) no-repeat 0 0;
	width: 52px;
	height: 45px;
	position: absolute;
	bottom: -45px;
	left: 50%;
	margin-left: -26px;
}
#lp section.box06 p .b {
	font-size: 48px;
	color: rgb(52,204,224);
}
#lp section.box06 h4 {
	text-align: center;
	color: rgb(52,204,224);
	font-size: 4.2em;
	line-height: 1.3;
	padding: 0 0 45px;
}
#lp section.box06 h4 .b {
	font-size: 20px;
	color: rgb(0,0,0);
}
#lp section.box06 .board {
	width: 1000px;
	overflow: hidden;
	margin: 0 auto;
}
* html #lp section.box06 .board {
	height: 1%;
}
#lp section.box06 .board dl {
	float: left;
	width: 480px;
	height: 375px;
	background-color: rgb(255,255,255);
	padding: 40px 30px 25px;
	box-sizing: border-box;
}
#lp section.box06 .board dl:nth-child(2n+2) {
	float: right;
}
#lp section.box06 .board dl dt {
	font-size: 3.6em;
	line-height: 0.8;
	float: right;
	width: 190px;
	padding: 45px 0 0;
}
#lp section.box06 .board dl dt .b {
	font-size: 14px;
	color: rgb(52,204,224);
}
#lp section.box06 .board dl dd {
	font-size: 1.6em;
	clear: both;
	padding: 30px 0 0;
}
#lp section.box06 .board dl dd.img {
	float: left;
	width: 160px;
	clear: none;
	padding: 0;
}

#lp section.box07 {
	background: url(/as/img/lp/bg_contact.jpg) no-repeat 0 0;
	background-size: cover;
	padding: 0 0 80px;
}
#lp section.box07 h4 {
	text-align: center;
	color: rgb(255,255,255);
	font-size: 4.2em;
	line-height: 1.3;
	padding: 25px 0 110px;
}
#lp section.box07 h4 .b {
	font-size: 20px;
	color: rgb(0,0,0);
}
#lp section.box07 .txt {
	width: 760px;
	margin: 0 auto;
	background-color: rgba(255,255,255,0.8);
	padding: 20px 20px 40px;
}
#lp section.box07 table {
	width: 100%;
}
#lp section.box07 table th {
	width: 200px;
	font-size: 1.6em;
	line-height: normal;
	padding: 0 0 20px;
	vertical-align: top;
}
#lp section.box07 table th span {
	border: solid 1px rgb(67,67,67);
	background-color: rgb(67,67,67);
	color: rgb(255,255,255);
	padding: 3px 5px;
	display: inline-block;
	width: 200px;
	box-sizing: border-box;
}
#lp section.box07 table td {
	padding: 0 0 20px 30px;
	font-size: 1.6em;
}
#lp section.box07 table td input,
#lp section.box07 table td textarea {
	width: 50%;
	background-color: rgb(255,255,255);
	border: solid 1px rgb(211,209,210);
	box-sizing: border-box;
	padding: 3px 5px;
	color: rgb(0,0,0);
	font-size: 16px;
	-moz-transition: width .3s;
	-webkit-transition: width .3s;
	-o-transition: width .3s;
	-ms-transition: width .3s;
	transition: width .3s;
}
#lp section.box07 table td input:focus,
#lp section.box07 table td textarea:focus {
	border: solid 1px rgb(255,165,38);
	outline: none;
	width: 100%;
	background: rgba(255,255,255,1);
}

#lp section.box07 table td input:required:valid,
#lp section.box07 table td textarea:required:valid {
	border: solid 1px rgb(64,200,255);
	background: rgba(64,200,255,0.2);
}
#lp section.box07 table td input.finished,
#lp section.box07 table td textarea.finished {
	border: solid 1px rgb(64,200,255);
	background: rgba(64,200,255,0.2);
}
#lp section.box07 table td input:invalid,
#lp section.box07 table td textarea:invalid {
	border: solid 1px rgb(246,82,82);
	background: rgba(246,82,82,0.2);
}
#lp section.box07 table td input:focus:valid,
#lp section.box07 table td textarea:focus:valid {
	border: solid 1px rgb(255,165,38);
	background: rgba(255,255,255,1);
}

#lp section.box07 p {
	font-size: 2em;
	text-align: center;
	padding: 0 0 25px;
}
#lp section.box07 nav.btn {
	text-align: center;
}
#lp section.box07 nav.btn label {
	overflow: hidden;
	display: block;
	width: 488px;
	height: 88px;
	margin: 0 auto;
}
#lp section.box07 nav.btn input {
	font-size: 2.6em;
	text-align: center;
	margin: 0 auto;
	display: inline-block;
	text-decoration: none;
	width: 488px;
	height: 88px;
	padding: 25px 0;
	box-sizing: border-box;
	border: none;
	background-color: rgb(52,204,224);
	color: rgb(0,0,0);
	letter-spacing: 4px;
	box-shadow: 0 0 4px rgba(0,0,0,0.4);
	border-radius: 4px;
	-moz-transition: 0.3s linear 0.1s;
	-webkit-transition: 0.3s linear 0.1s;
	-o-transition: 0.3s linear 0.1s;
	-ms-transition: 0.3s linear 0.1s;
	transition: 0.3s linear 0.1s;
}
#lp section.box07 nav.btn input:hover {
	background-color: rgb(244,245,246);
	color: rgb(51,51,51);
	cursor: pointer;
}
#lp section.box07 ul.err {
	padding: 0 0 10px;
}
#lp section.box07 ul.err li {
	color: rgb(255,28,81);
	font-size: 1.6em;
	font-weight: bold;
	text-align: center;
}


/*
99.animation
*/
@keyframes ac_hover {
	0% {
		opacity: 0;
		}
	100% {
		opacity: 1;
	}
}


/*
100.ripple
*/
.ripple {
    overflow: hidden;
    position: relative;
}

.ripple__effect {
    width: 150px;
    height: 150px;

    position: absolute;
    border-radius: 100%;
    pointer-events: none;
    transform: scale(0);
    opacity: 0;
}

.ripple__effect.is-orange { background: rgb(47,202,202);}
/*.ripple__effect.is-orange { background: #f1c40f;}
.ripple__effect.is-blue   { background: #4aa3df;}
.ripple__effect.is-black  { background: #999;}*/

.ripple__effect.is-show {
    animation: ripple 0.75s ease-out;
}

@keyframes ripple {
    from {
        opacity: 1;
    }
    to {
        transform: scale(2);
        opacity: 0;
    }
}