@charset "utf-8";



/* ===================================================== */
/* ==================== 【 table 】 ==================== */
/* ===================================================== */

.column-wrap {
display: flex;
flex-wrap: wrap;
padding:5px 0;
background: #fff;
color:#555;
font-size:0.95rem;
}

.column-cont {
width: 47%;
padding: 10px;
margin:5px;
background: #FFF;
border: 1px solid #ddd;
display: flex;
border-radius: 10px;
}

.column-img {
width: 40%;
}

.column-text {
width: 60%;
padding: 0 10px 0 20px;
texst-aligen
background: #e6b422;
text-align: left;
}

.time {
color:#000;
font-size:0.7rem;
padding-bottom:10px;

}


/*---------- max-width: 801px〜1250px ----------*/
@media screen and (min-width:801px) and ( max-width:1250px)  {

.column-cont {
width: 100%;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 800px ----------*/
@media screen and (max-width:800px){

.column-cont {
width: 100%;
}

/****/}/****/
/*---------- END ----------*/


/* ===================================================== */
/* ==================== 【 table 】 ==================== */
/* ===================================================== */






/* ===================================================== */
/* ==================== 【 table 】 ==================== */
/* ===================================================== */

/* ----------------------------------- */
/* ---------- 【 company 】 ---------- */
/* ----------------------------------- */

.tblcompany {
border-collapse: collapse;
border-spacing: 0;
border-top: 1px solid #ACACAC;
border-bottom: 1px solid #ACACAC;
width: 100%;
color: #333;
vertical-align:middle;
}
.tblcompany tr {
border-top: 1px solid #ACACAC;
border-bottom: 1px solid #ACACAC;
}
.tblcompany tr th,
.tblcompany tr td {
padding: 20px 20px;
text-align: left;
vertical-align:middle;
}
.tblcompany tr th {
width: 20%;
font-weight: bold;
background: #F2F2F3;
}
.tblcompany tr td {
width: 80%;
}


@media screen and (max-width:880px){

.tblcompany tr th {
width: 30%;
}
.tblcompany tr td {
width: 70%;
}

}
@media screen and (max-width:550px){

.tblcompany {
font-size:0.8em;
}
.tblcompany tr th,
.tblcompany tr td {
padding: 15px 10px;
}

}

/* ----------------------------------- */
/* ---------- 【 license 】 ---------- */
/* ----------------------------------- */

#tbllicense01 , #tbllicense02 , #tbllicense03 , #tbllicense04 {
border-left: 1px solid #1564b3;
border-top: 1px solid #1564b3;
border-collapse: collapse;
letter-spacing: .1em;
margin: 0 0 20px;
color: #000;
width: 100%;
font-size:90%;
}

#tbllicense01 th , #tbllicense02 th , #tbllicense03 th , #tbllicense04 th {
background-color: #cce5ff;
}

#tbllicense01 th, #tbllicense01 td , #tbllicense02 th, #tbllicense02 td , #tbllicense03 th, #tbllicense03 td , #tbllicense04 th, #tbllicense04 td {
text-align: center;
padding: 10px 5px;
border-right: 1px solid #1564b3;
border-bottom: 1px solid #1564b3;
}

#tbllicense01 th:first-child , #tbllicense02 th:first-child , #tbllicense03 th:first-child , #tbllicense04 th:first-child {
color: #000;
}

#tbllicense01 .head , #tbllicense01 .vertical , #tbllicense02 .head , #tbllicense02 .vertical , #tbllicense03 .head , #tbllicense03 .vertical , #tbllicense04 .head , #tbllicense04 .vertical {
background-color: #cce5ff;
}

#tbllicense01 .head span , #tbllicense02 .head span , #tbllicense03 .head span , #tbllicense04 .head span {
-webkit-writing-mode: vertical-lr;
-ms-writing-mode: tb-lr;
writing-mode: vertical-lr;
vertical-align: bottom;
font-size:80%;
}

#tbllicense01 .gray , #tbllicense02 .gray , #tbllicense03 .gray , #tbllicense04 .gray {
background-color: #f1f1f1;
}

#tbllicense01 .blue , #tbllicense02 .blue {
background-color: #e6efff;
}

td {
vertical-align: middle;
}

#tbllicense01 .fixed , #tbllicense01 .license , #tbllicense02 .fixed , #tbllicense02 .license , #tbllicense03 .fixed , #tbllicense03 .license , #tbllicense04 .fixed , #tbllicense04 .license {
vertical-align: middle;
}

#licensetbl05 {
border-left: 1px solid #1564b3;
border-top: 1px solid #1564b3;
border-collapse: collapse;
letter-spacing: .1em;
margin: 0 0 20px;
color: #000;
width: 100%;
font-size:1.0rem;
}

#licensetbl05 td {
text-align: left;
padding: 10px;
border-right: 1px solid #1564b3;
border-bottom: 1px solid #1564b3;
background: #e6efff;
}


/**********↓ ここからSP・TB　↓**********/

/*---------- max-width: 1038px ----------*/

@media only screen and (max-width: 1038px) {

#tbllicense01 {
display: block;
overflow-x: scroll;
white-space: nowrap;
}

#tbllicense01 .fixed {
position: sticky;
left: 0;
}

#tbllicense01 .fixed:before {
content: "";
position: absolute;
top: 0;
left: -1px;
right: -1px;
height: 100%;
border-left: 1px solid #707070;
border-right: 1px solid #707070;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 938px----------*/

@media only screen and (max-width: 938px) {

#tbllicense02 {
display: block;
overflow-x: scroll;
white-space: nowrap;
}

#tbllicense02 .fixed {
position: sticky;
left: 0;
}

#tbllicense02 .fixed:before {
content: "";
position: absolute;
top: 0;
left: -1px;
right: -1px;
height: 100%;
border-left: 1px solid #707070;
border-right: 1px solid #707070;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 849px----------*/

@media only screen and (max-width: 849px) {

#tbllicense03 {
display: block;
overflow-x: scroll;
white-space: nowrap;
}

#tbllicense03 .fixed {
position: sticky;
left: 0;
}

#tbllicense03 .fixed:before {
content: "";
position: absolute;
top: 0;
left: -1px;
right: -1px;
height: 100%;
border-left: 1px solid #707070;
border-right: 1px solid #707070;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 487px----------*/

@media only screen and (max-width: 487px) {

#tbllicense04 {
display: block;
overflow-x: scroll;
white-space: nowrap;
}

#tbllicense04 .fixed {
position: sticky;
left: 0;
}

#tbllicense04 .fixed:before {
content: "";
position: absolute;
top: 0;
left: -1px;
right: -1px;
height: 100%;
border-left: 1px solid #707070;
border-right: 1px solid #707070;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 521px----------*/

@media screen and (max-width:521px){

#licensetbl05 {
font-size:0.65rem;
}

/****/}/****/
/*---------- END ----------*/

/**********↑ ここまでSP・TB　↑**********/


/* ========= END ======================================= */
/* ==================== 【 table 】 ==================== */
/* ======================================= END ========= */





/* ====================================================== */
/* ==================== 【 button 】 ==================== */
/* ====================================================== */


/* ---------- 【 nextbutton 】 ---------- */

.btn-box {
width:100%;
margin:20px 0;
vertical-align: middle;
text-align:center;
}

.button-detail a {
background: #6bb6ff;
border-radius: 3px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
max-width: 240px;
padding: 10px 25px;
color: #FFF;
transition: 0.3s ease-in-out;
font-weight: 600;
border-radius: 50px;
border-bottom: 4px solid #1d7fde;
overflow: hidden;
}
.button-detail a:active {
transform: translateY(4px);
box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
border-bottom: none;
}
.button-detail a:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: -100%;
background-image: linear-gradient( 130deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 55%);
animation: shine 3s infinite;
}
@keyframes shine {
  33% {
    left: 100%;
  }
  100% {
    left: 100%;
  }
}
.button-detail a:after {
content: '';
width: 5px;
height: 5px;
border-top: 3px solid #FFF;
border-right: 3px solid #FFF;
transform: rotate(45deg) translateY(-48%);
position: absolute;
top: 48%;
right: 20px;
border-radius: 1px;
transition: 0.3s ease-in-out;
}


/* ---------- 【 mail,line,tel button 】 ---------- */

.button-mail a , .button-line a , .button-tel a {
border-radius: 10px;
position: relative;
display: block;
justify-content: space-around;
align-items: center;
margin: 0 auto;
max-width: 100%;
padding: 10px 25px;
color: #fff;
transition: 0.3s ease-in-out;
font-weight: 600;
text-align: center;
}

.button-tel a {
font-size: 1.5em;
}
.button-mail a:hover , .button-line a:hover , .button-tel a:hover {
color: #FFF;
}
.button-mail a:after , .button-line a:after , .button-tel a:after {
content: '';
width: 5px;
height: 5px;
border-top: 3px solid #fff;
border-right: 3px solid #fff;
transform: rotate(45deg) translateY(-50%);
position: absolute;
top: 50%;
right: 20px;
border-radius: 1px;
transition: 0.3s ease-in-out;
}
.button-mail a:hover:after , .button-line a:hover:after , .button-tel a:hover:after {
border-color: #FFF;
}

.button-mail a {
background: #ff8f1f;
}
.button-line a {
background: #06c755;
}
.button-tel a {
background: #e6002f;
border: 1px solid #fff;
color: #fff;
}
.button-mail a:hover {
background: #ffa64d;
}
.button-line a:hover {
background: #4cc764;
}
.button-tel a:hover {
background: #ff0000;
}


.line{
padding-left: 30px;
background: url(images/line.png) no-repeat left center;
}

.mail{
padding-left: 30px;
background: url(images/mail.png) no-repeat left center;
}


/* ========= END ======================================= */
/* ==================== 【 button 】 ==================== */
/* ====================================================== */





/* ============================================================= */
/* ===================== 【 FAQ & AREA  】 ===================== */
/* ============================================================= */

.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.cp_qa .cp_actab , .cp_qa .area-tab {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 1em 0;
	color: #1b2538;/*** 変更箇所 ***/
}
.cp_qa .cp_actab input , .cp_qa .area-tab input { 
	position: absolute;
	opacity: 0;
}
/* 質問 */
.cp_qa .cp_actab label, .cp_qa .area-tab label {
	font-weight: bold;
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0 0 0 0;
	padding: 1em 2.5em 1em 2.5em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background:#add8e6;/*** 変更箇所 ***/
}
.cp_qa .cp_actab label::before , .cp_qa .area-tab label::before {
	font-family: serif;
	font-size: 1.5em;
	margin-left: -2em;
	padding-right: 0.5em;
}
.cp_qa .cp_actab label:hover , .cp_qa .area-tab label:hover {
	transition: all 0.3s;
	color: #00838f;/*** 変更箇所 ***/
}
/* --質問の＋アイコン */
.cp_qa .cp_actab label::after , .cp_qa .area-tab label::after {
	font-size: 1.7em;
	font-weight: bold;
	line-height: 2em;
	position: absolute;
	top: 0;
	right: 0;
	content: '+';
	display: inline-block;
	width: 2em;
	height: 2em;
	-webkit-transition: transform 0.4s;
	        transition: transform 0.4s;
}
/* 答え */
.cp_qa .cp_actab .cp_actab-content , .cp_qa .area-tab .area-tab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 2.5em;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
	border-radius: 0 0 0.5em 0.5em;
}
.cp_qa .cp_actab .cp_actab-content::before , .cp_qa .area-tab .area-tab-content::before {
	font-family: serif;
	font-size: 1.5em;
	position: absolute;
	margin: 0.4em 0 0 -1em;
	padding: 0;
}
.cp_qa .cp_actab .cp_actab-content p , .cp_qa .area-tab .area-tab-content p {
	margin: 1em 1em 1em 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa .cp_actab input:checked ~ .cp_actab-content , .cp_qa .area-tab input:checked ~ .area-tab-content {
	max-height: 40em;
	border: 10px solid #add8e6;/*** 変更箇所 ***/
}
/* 質問をクリックした時のアイコンの動き */
.cp_qa .cp_actab input:checked ~ label , .cp_qa .area-tab input:checked ~ label {
	color: #00838f;/*** 変更箇所 ***/
	border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cp_qa .cp_actab input[type=checkbox]:checked + label::after , .cp_qa .area-tab input[type=checkbox]:checked + label::after {
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}


.cp_qa .area-tab {
	color: #000;/*** 変更箇所 ***/
}
.cp_qa .cp_actab {
	color: #1b2538;/*** 変更箇所 ***/
}

/* 質問 */
.cp_qa .area-tab label {
	background:#ff8f1f;/*** 変更箇所 ***/
        text-align:center;/*** 変更箇所 ***/
}
.cp_qa .cp_actab label {
	background:#add8e6;/*** 変更箇所 ***/
}

.cp_qa .area-tab label::before {
	content: '';/*** 変更箇所 ***/
}
.cp_qa .cp_actab label::before {
	content: 'Q';/*** 変更箇所 ***/
}

.cp_qa .area-tab label:hover {
	color: #fff;/*** 変更箇所 ***/
}
.cp_qa .cp_actab label:hover {
	color: #00838f;/*** 変更箇所 ***/
}

.cp_qa .area-tab .area-tab-content::before {
	content: '';/*** 変更箇所 ***/
}
.cp_qa .cp_actab .cp_actab-content::before {
	content: 'A';/*** 変更箇所 ***/
}

/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa .area-tab input:checked ~ .area-tab-content {
	border: 10px solid #ff8f1f;/*** 変更箇所 ***/
	padding: 0 0 0 1.0em;
	font-size: 0.8em;
}
.cp_qa .cp_actab input:checked ~ .cp_actab-content {
	border: 10px solid #add8e6;/*** 変更箇所 ***/
}

/* 質問をクリックした時のアイコンの動き */
.cp_qa .area-tab input:checked ~ label {
	color: #fff;/*** 変更箇所 ***/
}
.cp_qa .cp_actab input:checked ~ label {
	color: #00838f;/*** 変更箇所 ***/
}


/* ========= END =============================================== */
/* ===================== 【 FAQ & AREA  】 ===================== */
/* =============================================== END ========= */






/* ============================================================= */
/* ===================== 【    Footer   】 ===================== */
/* ============================================================= */

#footer-area {
width:100%;
padding:30px 0 0 0;
background:#0c3966;
text-align:center;
color:#fff;
overflow:hidden;
clear:both;
float:left;
position:relative;
}

#footer-area a {
color:#fff;
}

#footer-area a:hover {
color:#b5b5b5;
}

#footer-text {
width:1200px;
margin:0 auto;
}

#footermenu {
width:100%;
margin-bottom:0;
}

#footermenu ul {
width:98%;
display: flex; /* flexbox */
flex-wrap: wrap; /* 折返し指定 */
}

#footermenu li {
margin:0; 
padding:10px;
text-align:left;
font-size:0.8em;
}

#footermenu li a {
text-decoration:underline;
}

.footer-info {
width:100%;
padding:30px 10px;
float:left;
text-align:left;
}

#footer-copy {
width:100%;
padding-top:10px;
float:right;
}

#footer-title {
width:100%;
padding:10px;
float:left;
}


/**********↓ ここからSP・TB　↓**********/

/*---------- max-width: 801px〜1250px ----------*/
@media screen and (min-width:801px) and ( max-width:1250px)  {

#footer-text {
width:100%;
margin:0 auto;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 800px ----------*/
@media screen and (max-width:800px){

#footer-text {
width:100%;
margin:0 auto;
}

#footermenu {
width:100%;
margin:0px;
}

.footer-info {
width:auto;
text-align:left;
font-size:80%;
background:#0c3966;
}

#footer-copy {
width:100%;
padding:10px 0;
float:right;
background-color: #000;
font-size:80%;
}

#footer-title {
width:90%;
padding:5% 5% 25% 5%;
float:left;
background-color: #fff;
text-align:left;
font-size:80%;
font-weight:bold;
color: #0c3966;
}

.breadcrumbs {
margin:-50px 0;
padding:10px;
font-size:80%;
}

/****/}/****/
/*---------- END ----------*/


/*---------- max-width: 600px ----------*/
@media screen and (max-width:600px){

#footermenu ul {
margin-bottom:0;
}

#footermenu li {
width:100%;
padding:10px;
font-size:1.0em;
border-bottom:1px solid #fff;
}

#footermenu li a {
text-decoration:none;
}

/****/}/****/
/*---------- END ----------*/

/**********↑ ここまでSP・TB　↑**********/



/* ========= END =============================================== */
/* ===================== 【    Footer   】 ===================== */
/* =============================================== END ========= */