@charset "utf-8";
/* CSS Document */

.mainvisual{
width: auto;
max-width: 100%;
}
.mainvisual {
margin-top: 0px;
text-align: center;
margin-bottom: 10px;
}
.mainvisual img{
width: 100%;
max-width: 100%;
}
.inner h2{
text-align:center;
}
.sp_dis_n{
display:none;
}
.pc_dis_n{
display:block;
}
.inner h3 {
text-align: left;
color: #0099ff;
font-weight: bold;
margin-bottom: 1em;
font-size: 2em;
border-bottom: 1px #09f solid;
border-left: 0px #09f solid;
margin: 10px 0px 15px 0px;
}
.inner h4 {
text-align: left;
color: #0099ff;
font-weight: bold;
margin-bottom: 5px;
font-size: 1.5em;
padding: 10px 0px 0px 0px;
}
.ma_20p {
margin: 10px 0px;
}
.h3_margin{
margin: 20px 0px 15px 0px !important;
}
.inner h5 {
text-align: left;
color: #1569a0;
font-weight: bold;
margin-bottom: 0em;
font-size: 1.4em;
margin-top: 1.5em;
}
#mainContainer h2 {
color: #000;
font-weight: bold;
font-size: 1.5em;
line-height: 44px;
margin-bottom: 0;
border-bottom: none;
}
#mainContainer p {
font-size: 1.3em;
}
.con_ga01 li{
list-style: none !important;
width: 100%;
max-width: 100%;
}
.color_bk{
color:#000 !important;
}
.flip-horizontal {
transform: scale(-1, 1);
}
.border_solid {
border: solid 1px #ddd;
padding: 15px 30px 15px 30px !important;
}
.border_solid{
border: solid 1px #ddd;
padding: 30px;
}
/*右吹き出し*/
.arrow_box {
position: relative;
background: #88b7d5;
border: 4px solid #c2e1f5;
}
.arrow_box:after, .arrow_box:before {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.arrow_text{
font-size:1.5em;
}
.arrow_box:after {
border-color: rgba(136, 183, 213, 0);
border-left-color: #88b7d5;
border-width: 30px;
margin-top: -30px;
}
.arrow_box:before {
border-color: rgba(194, 225, 245, 0);
border-left-color: #c2e1f5;
border-width: 36px;
margin-top: -36px;
}
.arrow_box {
padding: 40px;
width: 200px;
border-radius: 6px;
}
.arrow_box {
position: relative;
background: #88b7d5;
border: 4px solid #c2e1f5;
}
.arrow_box:after, .arrow_box:before {
right: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}

.arrow_box:after {
border-color: rgba(136, 183, 213, 0);
border-left-color: #88b7d5;
border-width: 30px;
margin-top: -30px;
}
.arrow_box:before {
border-color: rgba(194, 225, 245, 0);
border-left-color: #c2e1f5;
border-width: 36px;
margin-top: -36px;
}
/*右吹き出し*/


/*左吹き出し*/
.arrow_box_b  {
padding: 40px;
width: 200px;
border-radius: 6px;
}
.arrow_box_b {
position: relative;
background: #88b7d5;
border: 4px solid #c2e1f5;
}
.arrow_box_b:after, .arrow_box_b:before {
right: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}

.arrow_box_b:after {
border-color: rgba(136, 183, 213, 0);
border-right-color: #88b7d5;
border-width: 30px;
margin-top: -30px;
}
.arrow_box_b:before {
border-color: rgba(194, 225, 245, 0);
border-right-color: #c2e1f5;
border-width: 36px;
margin-top: -36px;
}
/*左吹き出し*/
.width_ma{
width: 56%;
margin: 0 auto;
}
.border_sd1{
border: solid 1px #000;
}
.color_red{
color: red !important;
}
.space{
margin:10px;
}
.space_b{
margin:40px;
}
.space_c {
margin: 40px 0px;
}
.flt_l{
float: left;
}
.flt_r{
float: right;
}
#mainContainer ul {
margin-bottom: 0;
padding-left: 20px;
}
#footerContainer .inner {
width: 1000px;
margin: 0 auto;
padding: 15px;
display: table;
}
#footerContainer {
background: #0099ff;
color: #fff;
}
.bt_width{
width: 64%;
margin: 0 auto;
}
#mainContainer p {
margin-bottom: 5px;
}
.border_doted {
border-bottom: dotted 1px #4c4b4b;
margin: 20px auto 30px;
}
.border_solid_z {
border-bottom: dotted 1px #4c4b4b;
margin: 20px auto 30px;
}
.border_sd1p{
border:solid 1px #ddd;
}
.modal input:checked ~ .modal-overlay .modal-wrap {
text-align: center;
}
.text-left{
text-align:left;
}

@media screen and (max-width: 639px){
.con_ga01 img{
width:100%;
}
#mainContainer {
width: auto;
padding: 10px 0px 40px 0px;
}
.con_ga01 li {
float: none;
list-style: none !important;
width: 100%;
max-width: 100%;
}
#headerContainer img{
width:30%;
}
#footerContainer img{
width:30%;
}
#footerContainer .inner {
width: 94%;
padding: 3%;
}
.pc_dis_n{
display:none;
}
.sp_dis_n{
display:block;
}
#mainContainer ul {
padding-left: 0px;
}
.inner h5 {
margin-bottom: 0px;
}
.inner h3 {
font-size: 1.4em;
}
.inner h4 {
font-size: 1.3em;
}
.inner h5 {
font-size: 1.2em;
}
.inner h5 {
margin-bottom: 20px;
}
.modal .modal-wrap {
width: 80% !important;
padding: 50% 20px !important;
}
}

@media screen and (max-width: 370px){
.width_ma {
width: 66%;
margin: 0 auto;
}
}