@charset "utf-8";

/*****************************************************************

	トップページ＆共通レイアウト定義

*****************************************************************/

/* ====== BASE Module SET ===== */


*{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

html,
body{
	margin: 0;
	padding: 0;
}

html{
	overflow-y:scroll;
}

.second #page{
	padding-top: 84px;
}

h1,h2,h3,h4,h5,h6,
p,ul,ol,dl,dt,dd,li,
table,td,th,
address,
blockquote,form,fieldset,legend,div,hr,pre{
	margin: 0;
	padding: 0;
	font-style: normal;
	text-align: left;
	font-size: 100%;
	line-height: 1.2;
}

article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary {
	display: block;
}


body{
	background: #FFF;
	font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","meiryo","MS P Gothic","ＭＳ Ｐゴシック","Osaka", sans-serif;
	text-align: center;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

th,td{
	vertical-align: top;
}

img,
object,
embed{
	border: 0;
	vertical-align: top;
	outline: none;
	max-width: 100%;
	height: auto;
}

object:focus{
	outline: none;
}

embed:focus{
	outline: none;
}

img,
input,
select,
textarea{
	margin-top: 0;
	margin-bottom: 0;
	vertical-align: middle;
	font-size: 12px;
}

input[type="button"],
input[type="text"],
input[type="submit"] {
	-webkit-appearance: none;
}

button{
	background-color: transparent;
	border: 0;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

::-webkit-input-placeholder{
    color: #ccc;
}
::-moz-placeholder{
    color: #ccc;
}
:-moz-placeholder{
    color: #ccc;
}
:-ms-input-placeholder{
    color: #ccc;
}

abbr,
acronym,
fieldset{
	border: 0;
}

hr{
	margin: 2em 0;
	display: block;
	border: 0;
	border-bottom: 1px solid #ddd;
	clear: both;
}

img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;

	-moz-transition: 0.5s;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	vertical-align: top;

	-moz-user-select: none; 
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-user-drag: none; 
	user-drag: none;
}

iframe{
	display: block;
	vertical-align: top;
}

i,
em{
	font-style: normal;
}

a{
	color: #000;
	background: transparent;

	-moz-transition: 0.5s;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}

a:hover,
a:focus{
	color: #666;
}

a:hover img{
}

ul li{
	list-style: none;
}

/* ====== SKIP ===== */
ul#skip{
	display: none;
	/*IE Mac \*/
	display: block;
 	position:absolute;
	height: 0;
	width: 0;
	overflow: hidden;
	/*IE Mac */
}

.nav{ }
.place{ }
.clr{
	width: 0;
	height: 0;
	line-height: 0;
	font-size: 0;
	clear: both;
}

.cf{
	width: 100%;
	overflow: hidden;
}

.cf:after{
	display: block;
	clear: both;
	content: "";
}

::selection{background-color:#333; color: #fff; }
::-moz-selection {background-color:#333; color: #fff; }
input::selection,
textarea::selection{background-color:#b6d6fd; color: #000; }
input::-moz-selection,
textarea::-moz-selection{background-color:#b6d6fd; color: #000; }

div,
ul,
section,
article{
	width: auto;
	zoom: 1;
}


aside,
li,
dd,
ul,
section,
article{
	zoom: 1;
}

aside:after,
div:after,
ul:after,
li:after,
dd:after,
section:after,
article:after{
	display: block;
	clear: both;
	content: "";
}

h1,h2,h3,h4,h5,h6,
table,th,td,ul,ol,li,
dd,dt,dl,p{
	background: url(../images/aki.png);
}
.return{
	display: block;
	width: 0;
	height: 0;
	clear: both;
	overflow: hidden;
	visibility: hidden;
}

.tel_dis{ cursor: default; }

.sp_i{ display: none; }
.sp_b{ display: none; }

.pc_i{ display: inline; }
.pc_b{ display: block; }

.sp_ib{ display: none; }
.pc_ib{ display: inline-block; *display: inline; zoom: 1; }

.txt_c{ text-align: center;}
.txt_r{ text-align: right;}

/*============================================================
	TopContentsStyle
============================================================*/
 
/*============================================================
	Page / column
============================================================*/
#page{
	width: 100%;
	margin: 0 auto;
	text-align: left;
}

.inner{
	width: 100%;
	padding:  0 10px;
	text-align: left;
	margin: 0 auto;
	position: relative;
}

/*============================================================
	Header
============================================================*/
#page_header{
	width: 100%;
	padding: 20px 0;
	position: fixed;
	text-align: center;
	top: 0;
	left: 0;
	z-index: 1000;
}

#page_header ul:after,
#page_header .inner:after{
	content: normal;
}

#page_header .inner{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#page_header h1{
	width: 19%;
}
#page_header .nav{
	width: 70%;
}
#page_header ul{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	font-size: 14px;
}
#page_header li{ margin-left: 0.5em;}
#page_header a{
	display: block;
	width: 100%;
	text-align: center;
	text-decoration: none;
	color: #fff;
	padding: 12px 1vw 12px 1vw;
	border-bottom: 4px solid transparent;
	line-height: 1;
}
#page_header a:hover,
#page_header a.on{
	border-bottom: 4px solid #fff;
}
#page_header .btn_contact{
	position: relative;
	padding: 12px 40px;
	background: red;
	border-radius: 20px;
	border-bottom: 4px solid transparent !important;
	font-size: 16px;
}
.btn_more_1,
#page_header .btn_contact_1{ background-color: #5b90bc;}
.btn_more_2,
#page_header .btn_contact_2{ background-color: #005ba7;}

#page_header .btn_contact:hover{
	border-bottom: 4px solid transparent;
}

#page_header .def{
	display: inline;
}
#page_header .scr{
	display: none;
}

.second #page_header,
.scr_on #page_header{
	background: #fff;
	box-shadow: 0 0 5px 0 rgba(0,0,0,0.20)
}
.second #page_header a,
.scr_on #page_header a{
	color: #000;
}
.second #page_header a:hover,
.second #page_header a.on,
.scr_on #page_header a:hover,
.scr_on #page_header a.on{
	border-bottom: 4px solid #005ba7;
}
.second #page_header .btn_contact,
.scr_on #page_header .btn_contact{
	color: #fff;
}
.second #page_header .def,
.scr_on #page_header .def{
	display: none;
}
.second #page_header .scr,
.scr_on #page_header .scr{
	display: inline;
}

@media screen and (max-width: 980px) and  (min-width: 769px){

	#page_header ul{
		font-size: 12px;
	}
	#page_header a{
		padding: 10px 10px 10px 10px;
	}
	#page_header .btn_contact{
		padding: 10px 20px;
		font-size: 14px;
	}


}
/*============================================================
	Nav
============================================================*/

/*============================================================
	Content
============================================================*/
#content{
	width: 100%;
}

#content:after{
	display: block;
	clear: both;
	content: "";
}

/*============================================================
	Main
============================================================*/
#main{
	width: 100%;
}

#main:after{
	display: block;
	clear: both;
	content: "";
}

/* Main Design */
#main p,
#main ul,
#main dl,
#main ol,
#main blockquote,
#main pre,
#main td,
#main th{
	line-height: 1.5;
	font-size: 88%;
	margin-bottom: 1em;
}

#main table{
	margin-bottom: 1em;
}

#main td,
#main th{
	margin-bottom: 0;
}

#main h1,
#main h2,
#main h3,
#main h4,
#main h5,
#main h6{
	font-size: 100%;
	line-height: 1.5;
	margin-bottom: 1em;
}

/* default */
#main ul ul,
#main ul p,
#main ul blockquote,
#main ul pre,
#main ul dl,
#main dl dl,
#main dl p,
#main dl ul,
#main dl ol,
#main blockquote p,
#main blockquote ul,
#main blockquote dl,
#main blockquote ol,
#main ol blockquote,
#main ol pre,
#main ol p,
#main td p,
#main td ul,
#main td dl{
	font-size: 100%;
}

#main *:last-child{
	margin-bottom: 0;
}

/*============================================================
	TOP
============================================================*/
/*============================================================
	youtube
============================================================*/
.video_area{
    position:relative;
    padding-bottom: 56.25%;
    height:0;
    overflow:hidden;
}

.fil,
.video_area iframe,
#video_loop_sp video{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
		z-index: 1;
}
.fil{
	background: rgba(0,0,0,0.50);
		z-index: 2;
}

/* ===== main_image ===== */
#main .main_image{
	background: #000;
	color: #fff;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items:center;
	z-index: 1;
}
#main .main_image .sec_read{
	position: relative;
	z-index: 10;
}
#main .main_image h2{
	text-align:center;
	line-height: 1;
	margin-bottom: 1em;
	font-size: 60px;
	font-family: Oswald, Arial, Helvetica, sans-serif;
	font-weight: normal;
	letter-spacing: 0.1em;
}
#main .main_image h3{
	text-align:center;
	line-height: 1;
	margin-bottom: 2em;
	font-size: 24px;
}
#main .main_image p{
	line-height: 1;
	text-align: center;
}
#main .main_image .btn_more{
	margin: 0 5%;
}

.top_video_area{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 0;
}


/* ===== common ===== */
.btn_more{
	display: inline-block;
	position: relative;
	padding: 20px 40px 20px 20px;
	text-decoration: none;
	line-height: 1;
	min-width: 240px;
	border-radius: 5px;
	color: #fff;
	font-weight: bold;
	font-size: 18px;
}
.btn_contact:before,
.btn_more:before{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	transform: rotate(45deg);
	border-right: 2px solid #fff;
	border-top: 2px solid #fff;
}
.btn_more_1:hover,
#page_header .btn_contact_1:hover{ color: #fff; background: #4d7ba1;}
.btn_more_2:hover,
#page_header .btn_contact_2:hover{ color: #fff; background: #024882;}
/* ===== sec_top ===== */
#main .inner{
	max-width: 1200px;
}
.message,
.sec_top{
	padding: 15% 0 140px 0;
	position: relative;
	z-index: 5;
	background: #fff;
}
figure{
	margin: 0;
	padding: 0;
}

#main .txt{
	width: 53%;
	float: left;
}
#main .pic{
	display: block;
	width: 45%;
	float: right;
	text-align: center;
}
/* ===== top_head ===== */
#main .top_head{
	padding-left: 50px;
	font-size: 30px;
	line-height: 1;
	background: no-repeat left center url(../images/bg_top_head.png);
}
#main .top_read{
	font-size: 100%;
	line-height: 2;
}

/* ===== sec_top_1 ===== */
#main .sec_top_1 .txt{
	padding-top: 80px;
}
/* ===== sec_top_2 ===== */
#main .sec_top_2{ background: #f8f8f8;}
/* ===== sec_top_3 ===== */
#main .sec_top_3 .pic{ margin-bottom: 40px;}
#main .sec_top_3 .pic img{ margin-bottom: 10px;}
#main .sec_top_3 .pic_2{
	clear: both;
	display: flex;
	justify-content: space-between;
}
/* ===== message ===== */
#main .message{
	padding: 200px 0 65px 0;
	background: url(../images/bg_samurai.png) no-repeat center top;
	background-size: cover;
	color: #fff;
}
#main .message p{
	margin: 0 0 80px 0;
	text-align: center;
}
#main .message h2{
	margin: 0;
	text-align: center;
	font-size: 30px;
	line-height: 2;
}
/* ===== sec_top_4 ===== */
#main .main_head{
	font-size: 50px;
	color:#005ba7;
	text-align: center;
	line-height: 1;
}
/*============================================================
	Sub
============================================================*/
#sub{
	width: 100%;
}

/*============================================================
	Footer
============================================================*/
#page_footer{
	width: 100%;
	position: relative;
	z-index: 1;
	text-align: center;
	background: #fff;
}

#page_footer:after{
	display: block;
	clear: both;
	content: "";
}

.foot_nav{
	background: #f8f8f8;
	padding: 16px 0;
}
.foot_nav ul{
	text-align: center;
	font-size: 14px;
}
.foot_nav li{
	display: inline-block;
	line-height: 1;
}
.foot_nav a{
	text-decoration: none;
	padding: 0 1em;
	border-left: 1px solid #000;
}
.foot_nav li:last-child a{
	border-right: 1px solid #000;
}

#page_footer .copy{
	padding-bottom: 30px;
	text-align: center;
	font-family: Oswald, Arial, Helvetica, sans-serif;
}

#page_footer .logo{
	padding-top: 30px;
	text-align: center;
	margin-bottom: 1em;
}

#page_footer .logo img{
	max-width: 280px;
}

#main ._load{
	position: fixed;
	width: 100%;
	top: 0;
	bottom: 0;
	background: #005ba7;
	z-index: 1000;
	color: #fff;
	transition: transform 0.5s, opacity 0.5s;
	pointer-events: none;
}
#main ._load_bar{
	position: absolute;
	display: block;
	height: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index:-1;
	background: #5b90bc;
	transition: 0.1 height;
}
#main ._load_area{
	padding-top: 20vh;
	text-align: center;
	position: relative;
	eve
}
#main ._load_logo{
	text-align: center;
}
#main ._load_logo img{
	width: 200px;
}
#main ._load_read{
	text-align: center;
	font-size: 24px;
	margin: 1em 0;
}
#main ._load_txt{
	text-align: center;
	font-size: 40px;
	font-family: Oswald, Arial, Helvetica, sans-serif;
}
#main ._load_txt b{
	font-size: 200%;
}

.on #main ._load{
	transform: translateY(-100%);
	opacity: 0;
}

/* ==== anime ==== */

.main_image h2,
.main_image h3,
.main_image p{
	opacity: 0;
	transform: translateY(10%);
	transition: 1s opacity,1s transform;
}
.main_image h2{transition-delay: 1s;}
.main_image h3{ transition-delay: 1.5s;}
.main_image p{ transition-delay: 2s;}

.on .main_image h2,
.on .main_image h3,
.on .main_image p{ opacity: 1;
	transform: translateY(0);}

.main_head,
.top_head,
.top_read,
.pic,
.pic_2,
.message h2,
.case_logos{
	opacity: 0;
	transition: 1s opacity,1s transform;
}
.main_head{ transform: translateY(10%);}
.main_head.animeOn{ transform: translateY(0); opacity: 1;}

.top_head,
.top_read{
	transform: translateX(-5%);
	transition-delay:0.5s;
}
.top_head.animeOn,
.top_read.animeOn{
	transform: translateX(0);
	opacity: 1;
}
.pic,
.pic_2{
	transform: translateY(5%);
}
.pic.animeOn,
.pic_2.animeOn{
	transform: translateY(0);
	opacity: 1;
}
.message h2{
	transform: scale(0.9,0.9);
}
.message h2.animeOn{
	transform: scale(1,1);
	opacity: 1;
}
.case_logos.animeOn{
	opacity: 1;
}
#video_loop_sp{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56.25vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 77.77vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}
#video_loop {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}

/*============================================================
	faq Page
============================================================*/
#main .content_head{
	margin-bottom: 50px;
	background: #005ba7;
	padding: 25px 10px;
	line-height: 1;
	text-align: center;
	font-size: 30px;
	letter-spacing: 0.1em;
	color: #fff;
}
#main .content_head small{
	display: block;
	margin-top: 0.75em;
	font-family: Oswald, Arial, Helvetica, sans-serif;
	text-align: center;
	letter-spacing: 0;
	font-weight: normal;
}

#main .sec_faq{
	background: #f6f6f6;
	padding: 30px 30px 20px 30px;
	margin-bottom: 30px;
}
#main .sec_faq_item{
	background: #fff;
	margin-bottom: 10px;
}
#main .sec_faq h2{
	font-size: 30px;
}
#main .sec_faq h3{
	position: relative;
	padding: 20px 30px 20px 70px;
	font-size: 18px;
	margin-bottom: 0;
	color: #005ba7;
	cursor: pointer;
}
#main .sec_faq h3:after{
	display: block;
	position: absolute;
	width: 10px;
	height: 10px;
	top: 25px;
	right: 20px;
	transform: rotate(45deg);
	content: "";
	border-right: 2px solid #005ba7;
	border-bottom: 2px solid #005ba7;
}
#main .sec_faq h3+div{
	overflow: hidden;
	position: relative;
	max-height: 0;
	padding: 0 0 0 70px;
	background: #fbfbfb;
	opacity: 0;
	transition: 0.5s max-height, 0.5s padding, 0.5s opacity;
}
#main .sec_faq h3:before,
#main .sec_faq h3+div:before{
	display: block;
	position: absolute;
	content: "";
	top: 15px;
	left: 20px;
	font-size: 24px;
	width: 1.75em;
	height: 1.75em;
	line-height: 1.75;
	text-align: center;
	vertical-align: middle;
	font-family: Oswald, Arial, Helvetica, sans-serif;
	color: #fff;
	background: #999;
	border-radius: 50%;
	font-weight: normal;
}
#main .sec_faq h3:before{
	content: "Q";
	background: #005ba7;
}
#main .sec_faq h3+div:before{
	content: "A";
	background: #5b90bc;
}

#main .sec_faq h3.on+div{
	max-height: 10000px;
	padding: 20px 20px 20px 70px;
	opacity: 1;
}
#main .sec_faq h3.on:after{
	transform: rotate(225deg);

}

/*============================================================
	works Page
============================================================*/
#main .works_list{
}
#main .works_list .pic_works{
	overflow: hidden;
	position: relative;
	padding-top: 75%;
	box-shadow: 0 0 10px 0  #ddd;
	margin-bottom: 15px;
}
#main .works_list .pic_works img{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#main .works_list li{
	width: 32%;
	margin: 0 2% 2em 0;
	float: left;
}
#main .works_list li:nth-of-type(3n){
	margin-right: 0;	
}
#main .works_list li:nth-of-type(3n+1){
	clear: both;
}
#main .works_list .ico_category{
	margin-bottom: 15px;
	font-size: 12px;
}
#main .works_list .ico_category i{
	display: inline-block;
	padding: 5px;
	line-height: 1;
	background: #5b90bc;
	color: #fff;
}
@media screen and (max-width: 960px) and  (min-width: 480px){
	#main .works_list li{
		width: 48%;
		margin: 0 2% 2em 0;
		float: left;
	}
	#main .works_list li:nth-of-type(3n){
		margin-right: 2%;	
	}
	#main .works_list li:nth-of-type(3n+1){
		clear: none;
	}

	#main .works_list li:nth-of-type(2n){
		margin-right: 0;	
	}
	#main .works_list li:nth-of-type(2n+1){
		clear: both;
	}
}
@media screen and (max-width: 479px) {
	#main .works_list li{
		width: 100%;
		margin: 0 0 2em 0;
		float: left;
	}
	#main .works_list li:nth-of-type(3n){
		margin-right: 0;	
	}
	#main .works_list li:nth-of-type(3n+1){
		clear: none;
	}

	#main .works_list li:nth-of-type(2n){
		margin-right: 0;	
	}
	#main .works_list li:nth-of-type(2n+1){
		clear: both;
	}
}
#main .pageing{
	text-align: center;
	padding: 2em 0;
	font-size: 12px;
}
#main .pageing a{
	display: inline-block;
	text-decoration: none;
	min-width:2.5em;
	min-height: 2.5em;
	line-height: 2.5em;
	border: 1px solid #ddd;
	color: #999;
	text-align: center;
	vertical-align: middle;
}
#main .pageing i{ transform: scale(2,2)}
#main .pageing .on{ background: #f1f1f1;}
#main .pageing .page_nav_pn{ background: #005ba7; border: 1px solid #005ba7; color: #fff;}

/*============================================================
	extension Page
============================================================*/
#main .extension_list{
	font-size: 18px;
	font-weight: bold;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

#main .extension_list li{
	width: 24%;
	border-radius: 20px;
	margin-bottom: 2%;
}
#main .extension_list small{ font-size: 68%;}
#main .extension_list span{
	display: block;
	text-align: center;
	background: #f8f8f8;
	border-radius: 20px;
	padding-top: 60px;
	min-height: 120px;
	position: relative;
	z-index: -1;
}
#main .extension_list .ico{
	display: block;
	text-align: center;
	background: #fff;
	width: 140px;
	height: 140px;
	padding: 15%;
	margin: 0 auto -15% auto;
	border-radius: 50%;
	overflow: hidden;
	z-index: 1;
}
#main .extension_list .ico img{ opacity: 0.6;}
@media screen and (max-width: 768px) and  (min-width: 481px){
		#main .extension_list li{
			width: 32%;
		}
		#main .extension_list span{
		}
		#main .extension_list .ico{
			margin: 0 auto -20% auto;
			border-radius: 50%;
			width: 100px;
			height: 100px;
		}
}
@media screen and (max-width: 480px) {
	#main .extension_list li{
		width: 48%;
	}
	#main .extension_list span{
		padding-top:50px;
		min-height: 100px;
	}
	#main .extension_list .ico{
		margin: 0 auto -20% auto;
		border-radius: 50%;
		width: 100px;
		height: 100px;
	}
}
#main .btn_foot{
	padding: 30px 0 60px 0;
	text-align: center;
}

/*============================================================
	plan Page
============================================================*/
#main .plan_list{
	width: 100%;
	overflow: auto;
	margin-bottom: 45px;
}
#main .plan_list table{
	width: 100%;
}
#main .plan_list small{
	font-weight: normal;
	font-size: 50%;
}
#main .plan_list td,
#main .plan_list th{
	width: 20%;
	line-height: 1;
	border-bottom: 1px solid #e2e8ed;
}
#main .plan_list th{
	text-align: left;
	padding: 30px 0;
	font-size: 24px;
}
#main .plan_list td{
	text-align: center;
	padding: 30px 10px;
	font-size: 30px;
	vertical-align: middle;
	font-weight: bold;
}
#main .plan_list .plan_head{
	padding: 0 5px 25px 5px;
	background: none !important;
}

#main .plan_list th[colspan="2"]{
	width: 40%;
}
#main .plan_list th p{
	line-height: 1;
}
#main .plan_list th.opt{
	font-size: 18px;
	vertical-align: middle;
}
#main .plan_list .plan_name{
	font-size: 16px;
	padding: 50px 10px 20px 10px;
	background: #eee;
	border-radius: 20px;
	font-weight: normal;
}
#main .plan_list .plan_basic .plan_name {
	background: #f6f6f6;
}
#main .plan_list .plan_pre .plan_name {
	background: #f2f3db;
}
#main .plan_list .plan_ent .plan_name {
	background: #f3ebdb;
}
#main .plan_list td.plan_pre {
	background: #f2f3db;
}
#main .plan_list .plan_name .btn_more{
	padding: 12px 24px 12px 12px;
	border-radius: 20px;
}
#main .plan_list td span{
	font-size: 50%;
}
#main .plan_list .plan_name p{
	text-align: center;
	line-height: 1;
}
#main .plan_list .plan_name p+p{
	margin: 30px 0;
}
#main .plan_list .plan_name p+p+p{
	margin: 0;
}
#main .plan_list .plan_name strong{
	font-size: 36px;
	color: #005ba7;
	font-family: Oswald, Arial, Helvetica, sans-serif;
	font-weight: normal;
}
#main .plan_list .plan_pic{
	margin-top: 20px;
}
#main .plan_list .plan_pic+p{
	margin-top: 20px;
}
#main .txt_plan{
	font-size: 24px;
	text-align: center;
	margin-bottom: 70px;
}

.fa-minus{color:#999;}
.fa-circle-o{color:#005ba7;}

/*============================================================
	form Page
============================================================*/
#main .txt_frm_info{
	text-align: center;
	line-height: 1.8;
	margin-bottom: 60px;
	font-size: 16px;
}
#main .frm_contact{
	margin: auto;
	max-width: 520px;
}
#main .frm_contact .hrf_2{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

#main .frm_contact .hrf{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}

#main .frm_contact .hrf_2>span{ width: 48%;}
#main .frm_contact .hrf>span{ width: 20%; margin-right: 2%;}
#main .frm_contact .hrf>span+span{ width: 40%;}

#main .frm_contact p{
	margin-bottom: 1em;
}
#main .frm_contact .plan{
	margin: 2em 0;
	display: flex;
	justify-content: space-between;
}
#main .frm_contact .checked,
#main .txt_inp:focus{
	background: #d9e7f3;
	border-color: #000;
}
#main .frm_contact label{
	border: 1px solid #eee;
	padding: 10px;
	width: 33%;
	display: block;
	border-radius: 5px;
	cursor: pointer;
}

#main .frm_contact .inp_agree{
	border: 1px solid #5b90bc;
	padding: 10px;
	width: 100%;
	color: #fff;
	background: #5b90bc;
	text-align: center;
}
#main .txt_inp{
	display: block;
	width: 100%;
	border: 1px solid #eee;
	padding: 10px;
	font-size: 16px;
	border-radius: 5px;
	height: 3em
}
#main .frm_contact .agree{
	margin-bottom: 30px;
}
#main .txt_inp_agree{
	font-size: 14px;
	height: 100px;
}
#main select{ height: 3em;}
#main .errOn{
	border: 1px solid red;
	margin-bottom: 10px;
}
#main .err{
	display: block;
	color: red;
	font-weight: bold;
}
#main .change{
	padding: 30px 0;
}
#main .btn_frm_next,
#main .btn_frm_prev{
	display: block;
	margin: auto;
	width: 100%;
	padding: 20px;
	margin-bottom: 1em;
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	color: #fff;
	border: 0;
	border-radius: 5px;
	text-decoration: none;
}
#main .btn_frm_prev{ background: #666;}
#main .btn_frm_next{ background: #005ba7;}

#main .frm_contact table{
	margin-bottom: 0;
	width: 100%;
}
#main .frm_contact th,td{
	padding-bottom:1.5em;
	font-size: 16px;
	vertical-align: middle;
}
#main .frm_contact th{
	width: 30%;
	font-weight: normal;
	text-align: right;
}
#main .frm_contact .frm_colon{
	width: 5%;
	font-weight: normal;
	text-align: center;
}
#main .frm_contact .frm_result{
	width: 65%;
	font-weight: bold;
	font-size: 18px;
}
#main .head_frm_info{
	text-align: center;
	font-size: 24px;
	color: #005ba7;
	margin-bottom: 1em;
}
#main .head_frm_info+p{
	font-size: 18px;
}