@charset "utf-8";

/* =================================================================
		Reset Styles
================================================================= */
body,div,dl,dt,dd,ul,ol,
li,h1,h2,h3,h4,h5,h6,form,
input,textarea,p,th,td {
	margin: 0;
	padding: 0;
	/* border: 0; */
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	font-family: "Yu Gothic", 游ゴシック, YuGothic, 游ゴシック体;
}

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

img {
	border:0;
	vertical-align: bottom;
}

address,caption,em,th {
	font-style:normal;
	font-weight:normal;
}

li {
	list-style-type: none;
}

caption,th {
	text-align:left;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

/*レスポンシブの画像の大きさ*/
img {
max-width: 100%;
height: auto;
}

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

/*===========================================================
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 2.8.1
===========================================================*/

body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input/*,button*/,textarea/*,button*/{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

/* ==================================================
 style info :

fonts
 10px = 77%     11px = 85%     12px = 93%     13px = 100%
 14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
 18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%
 22px = 167%    23px = 174%    24px = 182%    25px = 189%
 26px = 197%

=================================================== */
/*ここからbodyの設定を書く*/
html {
	overflow-y: scroll;
	font-size: 62.5%;/* 16pxに625%を掛けると100pxになるよ！ */
}

body {
    -webkit-text-size-adjust: 100%; /*勝手に文字が大きくなる対策*/
	width: 100%;
    font-family: 'Quintessential', cursive;
    letter-spacing: 0.04em;
	color: #3e3e3e;
	font-size: 1.5rem;
}

a {
	-webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
	color: #333;
}

a:hover {
    text-decoration: underline;
    opacity: 0.5;
}

a:link {
	text-decoration: none;
}

a:visited {
}

a:active {
	text-decoration: none;
}

/*フェードインフェードアウト*/
.fadein {
    opacity : 0;
    transform: translateY(20px);
    transition: all 1s;
}


h2, h3 {
	font-weight: bold;
}

header#header {
	width: 100%;
	font-size: 1.6rem;
	padding-left: 10px;
	/* height: 90px; */
	line-height: 70px;
	position: fixed;
    top: 0;
    right: 0;
	left: 0;
	background: #fff;
	box-shadow: 0 1px 2px rgba(11,41,62,.1);
	z-index: 1;
}

h1 {
	/* line-height: 70px; */
}

#header_nav {
	display: flex;
	justify-content: space-between;
	max-width: 100%;
}


#header_nav ul {
    display: flex;
    /* height: 80px; */
}

#header_nav ul li {
	padding: 0 20px;
	text-align: center;
}

#header_nav ul li a {
	color: #333;
	display: block;
}

#header_nav ul li:last-child {
	padding: 16px 10px;
}	

#header_nav ul .li_a_contact {
	line-height: 1.4;
	padding-top: 5px;
	display: flex;
}
.span_i {
	padding: 10px 15px;
}

.nav_border {
    border-left: 1px solid #dfdfdf;
}
.login a {
	/* line-height: 70px; */
}

.nav_a {
	line-height: 50px;
	margin: 15px 0;
}

.login {
    background: #626263;
    margin: 0 auto;
    line-height: 83px;
}

#main_visual {
	width: 100%;
	padding-top: 83px;
	position: relative;
}

.p_main img {
	width: 100%;
}

.p_text {
	margin: 0 auto;
	text-align: center;
	color: #fff;
	font-weight: bold;
	font-size: 3.6rem;
	padding: 50px;
}

.main_text_right {
	right: 2%;
	top: 80px;
	position: absolute;
	width: 35%;
}

.p_chat {
	font-size: 2.5rem;
	text-align: center;
	color: #fff;
	text-decoration: underline;
	padding: 10px;
	line-height: 2;
	margin-bottom: 30px;
}

.p_pc_sp {
	width: 400px;
	margin: 0 auto;
}

.p_button_white {
	background: #fff;
	text-align: center;
	padding: 20px;
	border-radius: 50px;
	font-size: 2rem;
	width: 300px;
	margin: 0 auto;
	margin-bottom: 45px;
	display: block;
}

.p_button_white a {
	color: #F08300;
	font-weight: bold;
}

.p_pc_sp {
    
}

.box_yellow {
    position: absolute;
    left: 3%;
    bottom: -100px;
    background: #FFF9B1;
    border-radius: 20px;
    padding: 10px;
    box-shadow: 0 0 10px grey;
    width: 550px;
}

.box_yellow h3 {
    color: #ff0000;
    font-weight: bold;
    text-align: center;
    font-size: 2.4rem;
    margin: 10px auto;
}

.box_yellow ul {
    text-align: left;
    width: 90%;
    margin: 0 auto;
    line-height: 1.8;
	font-size: 1.7rem;
}

.val {
    margin: 0 auto;
    width: 2106px;
    margin-top: 90px;
    max-width: 90%;
}

.orange_line {
	border-top: 2px solid #F08300;
	border-bottom: 2px solid #F08300;
	padding: 15px 30px;
	margin: auto;
	font-size: 25px;
	color: #333;
	text-align: center;
	font-weight: bold;
	width: 90%;
}

.triangle {
	margin: 0 auto;
	max-width: 90%;
	width: 1280px;
}

.enga_text {
	margin: 40px auto;
	width: 1000px;
}

.orange_box {
	margin: 20px auto 50px;
	border: 2px solid #F08300;
	width: 90%;
	max-width: 1000px;

}

.orange_box ul {
	padding: 30px;
	padding-left: 120px;
	line-height: 1.8;
}

.orange_box ul li {
	color: #333;
	font-size: 1.8rem;
}

.enga_can_three {
	margin: 0 auto;
	width: 90%;
}

.img_wrap {
	display: flex;
	margin: 0 auto;
	justify-content: center;
	width: 90%;
	
}

.img_inner {
	width: 50%;
	margin: 0 auto;
}

.img_inner_1 {
	width: 90%;
	background: #EFEFEF;
	margin: 0 auto;
    padding: 20px;
    height: 100%;
    min-width: 470px;
}

.div_img_inner {
    width: 90%;
	margin: 0 auto;
	padding: 10px;
}

.p_img_inner {
	margin-top: 10px;
	line-height: 1.5;
	font-size: 1.4rem;
}

.div_img_inner h2 {
    font-size: 25px;
    color: #F08300;
    margin-top: 20px;
}

#plan_wrap {
    background: #fff;
    width: 100%;
    padding: 50px 0 100px;
    margin-top: 100px;
}

#plan_wrap h2 {
    color: #626263;
	font-size: 30px;
	text-align: center;
    margin-bottom: 10px;
    font-weight: bold;
}

.plan_border {
    width: 100px;
    background: #626263;
    margin: 0 auto;
    height: 2px;
}

.table_wrap {
    background: #fff;
    margin: 50px auto 60px;
	padding: 20px;
	width: 800px;
	max-width: 90%;
}

.table_wrap h3 {
    font-size: 28px;
    background: #F08300;
    text-align: center;
    font-weight: bold;
    padding: 20px 0;
    color: #fff;
}

.triangle_orange {
    width: 0;
    height: 0;
    border-top: 20px solid #F08300;
    border-right: 20px solid transparent;
    border-bottom: 0px solid transparent;
    border-left: 20px solid transparent;
    margin: 0 auto;
}

.border_gr {
    background: #ccc;
}

.border_gray {
    background: #efefef;
}

table {
	width: 100%;
	max-width: 900px;
    margin: 50px auto;
}

table th {
    font-size: 16px;
	font-weight: bold;
	background: #f2f7f9;
	width: auto;
}

table tr {
    font-size: 16px;
    width: 100%;
    font-weight: normal;
}

table td, table th {
    text-align: center;
    padding: 20px 30px;
}

table td {
	text-align: left;
}

.faq_box {
    width: 550px;
    margin: 0 auto;
    margin-top: 20px;
    text-align: center;
	max-width: 95%;
}

.faq_box_q {
    background: #FFF9B1;
    width: 100%;
    padding: 10px 20px;
    font-size: 2.2rem;
    font-weight: bold;
	color: #F08300;
}

.faq_box_a p {
    background: #fff;
    width: 100%;
    padding: 20px 10px;
	font-size: 16px;
	color: #626263;
}

#faq span {
	font-size: 17px;
	font-weight: normal;
}

.contact_border {
	color: #fff;
    text-align: center;
    width: 100%;
    padding: 10px 0;
    position: fixed; 
    bottom: 0;
    right: 0;
    left: 0;
    font-size: 2rem;
    background: #f08000;
    border-top: 1px solid #f9b800;
}

.contact_border a {
	color: #fff;
	display: block;
}

.contact_nav {
	background: linear-gradient(90deg,#f9b800,#f08000);
}

.login a, .contact_nav a {
	color: #fff !important;
}

.plus_button {
	display: flex;
}

/*下記のからアコーディオンのCSS/jQueryは別*/
.accordion {text-align: center; line-height: 1.8;}
.accordion .inner {display: none; padding: 20px 30px; background: #fff;}
.accordion .title {cursor: pointer;}
/*.accordion .ac1{background: #F50057;}
.accordion .ac2{background: #FFEA00;}
.accordion .ac3{background: #64DD17;}*/
.accordion .inner .content {padding: 10px 0; position: relative; text-align: center;}
.accordion .inner .close{padding: 10px ; position: absolute; right: 10px; font-size: 20px; cursor: pointer;}
/*.accordion .inner .content1{background: #F48FB1;}
.accordion .inner .content2{background: #FFF59D;}
.accordion .inner .content3{background: #C5E1A5;}*/


/*お問い合わせフォーム*/
#contact_form {
	padding: 180px 0;
	font-size: 1.6rem;
}

#h1_contact {
	text-align: center;
	font-size: 2.6rem;
	font-weight: 700;
}

h1 span {
	font-weight: normal;
	font-size: 15px;
	letter-spacing: 2px;
}

form {
	line-height: 1.8;
}

textarea{
	resize : both;
  }

.custom_form {
    max-width: 680px;
    margin: 0 auto;
    width: 90%;
}

label {
	display: block;
    text-align: left;
	padding-bottom: 5px;
	color: #2e4657;
}

.contact_box {
	padding: 10px;
}

label span {
	display: inline-block;
    background-color: #fff;
    font-size: 10px;
    padding: 3px;
    vertical-align: text-top;
	margin-left: 10px;
	line-height: 1;
}

.span_red {
	display: inline-block;
    background-color: #fff;
    font-size: 10px;
    padding: 3px;
	line-height: 1;
    color: #e03862;
    border: solid 1px #e03862;
    vertical-align: text-top;
	margin-left: 10px;
}

label .span_gray {
	display: inline-block;
    color: #2e4657;
    background-color: #dfdfdf;
    font-size: 10px;
    border: solid 1px #dfdfdf;
    padding: 3px;
    vertical-align: text-top;
    margin-left: 10px;
}

label .span_note {
	color: #999;
	font-size: 1.2rem;
}

input.input, select, textarea {
	padding: 12px 10px;
    border-radius: 4px;
    -webkit-box-shadow: none;
	box-shadow: none;
	border-color: #dfdfdf;
	color: #2e4657;
	border: 1px solid rgba(0,0,0,.3);
	width: 100%;
	font-size: 14px;
}

input#input_privacy_policy {
	width: auto !important;
}

select {
	height: 46px!important;
    padding: 10px 30px 10px 10px;
    border: 1px solid #dfdfdf;
    border-radius: 4px;
    background-color: #fafafa;
    cursor: pointer;
}

.div_privacy_policy {
	font-size: 14px;
	padding: 10px;
}

.check_box a {
	color: #0078ca !important;
}

.submit {
	margin: 1rem auto;
	padding: 5px;
	transition: all .4s ease 0s;
    border-radius: 50em;
    position: relative;
    border: 0 !important;
    font-size: 15px;
    width: 240px;
	height: 54px;
	background: linear-gradient(90deg,#f9b800,#f08000);
	color: #fff;
	display: inline-block;
	margin-left: 40px;
}

.submit_center {
	text-align: center;
}


/*プライバシーポリシーのページ*/
h1.entry-title {
	display: table-cell;
    width: 100%;
    height: 100%;
    margin: 0;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    font-weight: 400;
    letter-spacing: .4em;
    text-transform: uppercase;
	background-color: rgba(0,0,0,.75);
	height: 200px;
	display: table;
	background: #333;
	padding: 90px 0;
	font-size: 2rem;
	margin-top: 80px;
}

.entry-section {
    padding-top: 50px;
	padding-bottom: 50px;
	line-height: 2;
}

.section-inner {
	padding-left: 30px;
    padding-right: 30px;
    width: 100%;
}

h2.section-title {
	font-size: 1.5em;
	font-weight: bold;
	padding-bottom: 40px;
	position: relative;
    margin: 0;
    padding-top: 20px;
    text-align: center;
    letter-spacing: .25em;
    text-transform: uppercase;
}

ol {
	/* width: 80%;
	margin: 50px auto;
	counter-reset: number;
	display: block;
	padding-inline-start: 40px; */
}

#terms_wrapper ol {
	width: 100%;
	padding-left: 0;
}

.policy-info {
    background: #f2f7f9;
    width: 450px;
    padding: 20px 30px;
    margin-top: 20px;
	margin: 20px auto 0;
}

h3.faq_box_a {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    /* margin-block-end: 1em; */
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.section-body {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    line-height: 2;
    letter-spacing: .1em;
}

/*メッセージページ*/
#main_message {
	padding: 180px 0;
	font-size: 1.6rem;
}

h2.h2_message span {
    font-size: 17px;
    font-weight: normal;
}

#main_message ul {
	text-align: left;
	margin-bottom: 20px;
}

.article {
	width: 800px;
	max-width: 90%;
	margin: 0 auto;
	line-height: 1.8;
	background: #f2f7f9;
	padding: 20px 30px;
	margin-bottom: 30px;
	/* display: flex; */
}

.h2_message {
	font-weight: bold;
	text-align: center;
	font-size: 2.6rem;
	line-height: 1.3;
	/* margin: 20px auto; */
	display: block;
	width: 100%;
	/* padding-top: 25px; */
}

.article .h3_message {
	font-weight: bold;
	text-align: center;
	margin: 20px auto;
	font-size: 2rem;
}

.article p {
	margin-bottom: 20px;
}

#footer, #footer_top {
	width: 100%;
	background: #f2f2f2;
	/* padding-bottom: 50px; */
	height: auto;
	vertical-align: top;
	color: #555;
	font-size: 12px;
}

#footer_top {
	height: 80px;
}

.copyright {
	/* text-align: center; */
	margin-left: auto;
}

.footer_inner {
	display: flex;
	padding: 10px 0;
	width: 1000px;
	margin: 0 auto;
}

#footer .footer_inner ul, #footer_top .footer_inner ul {
	display: flex;
}

#footer .footer_inner ul li, #footer_top .footer_inner ul li {
	padding-left: 20px;
}

.accordion p {
	text-align: left;
}

i.fa-plus {
	text-align: right;
    padding-top: 25px;
}

.title_wrapper {
	display: flex;
	text-align: center;
	width: 100%;
}

#main_message .title {
	background: #f2f7f9;
	width: 800px;
	margin: 0 auto;
	padding: 15px;
}

.text_right {
	text-align: right !important;
	font-weight: bold;
	margin: 50px auto 0;
}


/*会社概要ページ*/
#main_company {
	padding: 180px 0;
	font-size: 1.6rem;
}

#main_company table {
	max-width: 900px;
	width: 90%;
}

#main_company table th {
	width: 25%;
}

#main_company table td {
	text-align: left;
	line-height: 2;
}

#main_company table td a {
    background: linear-gradient(90deg,#f9b800,#f08000);
    padding: 15px;
    color: #fff;
    margin-right: 5px;
	line-height: 2.5;
}

#main_company h1 {
	font-weight: bold;
	text-align: center;
	font-size: 2.6rem;
}

h1 span {
    font-weight: normal;
    font-size: 15px;
    letter-spacing: 2px;
}

#main_company dl {
	display: flex;
}

#main_company dt {
    width: 110px;
    font-weight: bold;
}


/*プライバシーポリシー*/
#policy_wrapper, #terms_wrapper {
	line-height: 1.8;
}

#policy_wrapper, #terms_wrapper {
	width: 900px;
	margin: 0 auto;
	padding: 180px 0;
}

.h1_title {
	text-align: center;
	font-size: 2.6rem;
	font-weight: 700;
	margin-bottom: 20px;
}

#policy_wrapper p, #policy_wrapper ul, #policy_wrapper ol, #terms_wrapper p, #terms_wrapper ul, #terms_wrapper ol  {
	margin-bottom: 20px;
}

#policy_wrapper h2, #terms_wrapper h2 {
	font-size: 18px;
	margin-bottom: 20px;
}

#policy_wrapper ol li, #policy_wrapper ul li, #terms_wrapper ol li, #terms_wrapper ul li  {
	list-style-position:inside;
	text-indent: -1em;
	padding-left: 1em;
}