
  
:root {
  --main_c : #266df1;
}
:root {
  --main_c2 : #2a5ab3;
}
 
   
.t_color {color:var(--main_c)}
 

.flex {display:flex}
.div_50 {width:50%}
.div_30 {width:30%}
.div_100 {width:100%; display:inline-block; }
.box_100 {width:100% !important;   }

.b_t {font-size:1.3em}
.b_t2 {font-size:1.1em}

 @media all and (max-width:721px) {

  .b_t {font-size:1.1em}

}

.flex_list {display:flex; gap:15px}
.flex_list li   {border:1px solid #ddd; box-sizing:border-box}
.flex_list li img {width:100%}

.arrow { position: relative; width:15px; height:20px;  margin-left:10px; display:inline-block }
.arrow::after {
	position: absolute;

	top:0;
	content: '';
	width:10px; 
	height:10px; 
	border-top: 2px solid #fff; 
	border-right: 2px solid #fff;
	 transform: rotate(45deg);  right:0;
} 
.arrow::before {
  content:'';
  width:100%; 
  height:2px;
  position:absolute;
   top:6px;
  transform:translateY(-50%);
  background:#fff;
  right:0;
}
 
a.btn {
     color: var(--main_c2);
    padding: 10px 15px;
    border: 2px solid var(--main_c2);
    display: inline-flex;
    transition: all 0.3s ease-out;
    position: Relative;
    overflow: hidden;
    font-size:16px;
	border-radius:5px;
	font-weight:600; 
 	display:inline-flex; align-items:center; 
}
a.btn:hover {background:rgba(42,90,179,.05)}
a.btn i {margin-left:20px; }


a.btn .arrow {margin-top:3px;  height:15px }
a.btn .arrow::after { 
	border-top: 2px solid var(--main_c2); 
	border-right: 2px solid var(--main_c2);
 
} 
a.btn .arrow::before {
   background:var(--main_c2);
 }
 

 @media all and (max-width:721px) {
   .flex {flex-wrap:wrap}
    a.btn {font-size:15px}

}



.in {width:100%; max-width:1200px; margin:0 auto; }
 
a.underline_btn {font-size:1.05em; font-weight:600; color:#000; position:relative; padding:0 3px 5px 3px; }
a.underline_btn:after {content:''; width:0; height:2px; position:absolute; background-color:#000; bottom:0; left:0; transition: all 0.3s ease-out;}
a.underline_btn:hover:after { width:100%; }

.line_tit {width:100%;  position:relative }
.line_tit:after {content:''; width:100%; height:1px; background-color:#ddd; position:absolute; left:0; top:50%; z-index:-9}
.line_tit span {background-color:#fff; display:inline-block; padding:0 20px; font-size:1.4em; font-weight:500}

p.s_tit {font-size:14px; font-weight:600; color:var(--main_c);  letter-spacing:-.2px }
hr.main_hr {height:100px}


@media all and (max-width:1201px) {
 	  .in {padding-left:3%; padding-right:3%; box-sizing:border-box }
	  a.underline_btn {font-size:1em;   }
	  hr.main_hr {height:70px}
	  p.s_tit {font-size:14px}
	  .m_in_none {padding:0}


}

ul.basic li {width:100%; display:flex; align-items:flex-start}
ul.basic li:before {flex-shrink:0; content:''; margin-top:7px;  margin-right:7px; width:5px; height:5px; background-color:#555; border-radius:50%; display:inline-block}

ul.num_list li {width:100%; display:flex; align-items:flex-start}
ul.num_list li:before {flex-shrink:0; content:'1.'; margin-right:7px;  display:inline-block}
ul.num_list li:nth-child(2):before {content:'2.'; }
ul.num_list li:nth-child(3):before {content:'3.'; }
ul.num_list li:nth-child(4):before {content:'4.'; }
ul.num_list li:nth-child(5):before {content:'5.'; }
ul.num_list li:nth-child(6):before {content:'6.'; }
ul.num_list li:nth-child(7):before {content:'7.'; }

ul li ul.num_list  {width:90%; margin-left:20px}

.table_wrap {width:100%; overflow-x:auto}
table.basic td {border:1px solid #ddd; padding:10px}
table.basic th {border:1px solid #ddd; background-color:#f1f1f1; border-top:1px solid #333;  padding:10px}

/***footer***/

a.fixed_link {background:rgba(38,109,241,.9);  bottom:50px; right:0; padding:20px; color:#fff; display:flex; align-items:center;  position:fixed;  z-index:999}
a.fixed_link  span {font-family: 'poppins';  font-size:20px;  line-height:1.4}
a.fixed_link .arrow {top:5px}
 

footer {background-color:#333; color:#fff; padding-bottom:60px }
footer a {color:#fff}
footer section {padding-top:0; padding-bottom:0}
footer dl  {display:flex; margin-bottom:8px}
footer dl dt {width:150px; flex-shrink:0; font-weight:600}
footer ul.sns {display:flex; margin-left:auto}
footer ul.sns li {margin-left:10px}

 
ul.footer_ul li {line-height:60px;  padding-right:15px}
ul.footer_ul  + a {margin-left:auto; line-height:60px; width:60px; text-align:Center;   background:#266df1; color:#fff}


@media all and (max-width:721px) {
	a.fixed_link { padding:15px 15px;  }
	a.fixed_link  span { font-size:14px; font-weight:500; line-height:1.5; }
	a.fixed_link .arrow { top:5px;  }


	footer dl {flex-wrap:wrap}
	footer dl dt {width:100%}
	footer ul.sns {margin-top:10px}
}


.bg_box {background-color:#f7f7f7; padding:15px; box-sizing:border-box; width:100%; display:inline-block}
.border_box {border:1px solid #666; padding:15px; box-sizing:border-box;   width:100%; display:inline-block }

.basic_btn {background-color:var(--main_c); font-size:1.1rem; box-sizing:border-box; padding:0 20px; width:200px; line-height:50px; color:#fff; border-radius:5px; display:flex; justify-content:center; transition: all 0.3s ease-out; }
.basic_btn:hover {background-color:var(--main_c2);   }

.basic_btn2 {background-color:var(--main_c); font-size:1.1rem; box-sizing:border-box; padding:0 20px;   line-height:50px; color:#fff; border-radius:5px;  display:inline-block; transition: all 0.3s ease-out; }


.bottom_inquiry {position:relative; overflow:hidden; background-color: #213e78;}
.bottom_inquiry > .flex {justify-content:space-between }
.bottom_inquiry h3 {font-family: 'poppins'; font-size:2em; font-weight:500}
.bottom_inquiry  img {position:absolute; left:0; top:50%; transform: translate(0, -50%);  opacity:.2}
.bottom_inquiry .in {position:relative; z-index:9; color:#fff}
.bottom_inquiry .in a.btn {border:2px solid #fff; color:#fff;  }
.bottom_inquiry .in a.btn .arrow { transform: rotate( -45deg ); margin-top:5px; }
.bottom_inquiry .in a.btn .arrow::after {  border-top: 2px solid #fff;  border-right: 2px solid #fff; } 
.bottom_inquiry .in a.btn .arrow::before { background:#fff;  }
.bottom_inquiry .in a.btn:hover {background:rgba(255,255,255,.08)}

 

 @media all and (max-width:721px) {
		.bottom_inquiry h3 { text-align:Center; width:100%;  font-size:1.3em;  margin-bottom:25px }
		.bottom_inquiry .in a.btn {margin:0 auto }


}



