@charset "utf-8";

/* keyvisual
-------------------------------------*/
div.column-block{
padding: 0 20px;
}

/* article-A
-------------------------------------*/
article.article-A div.column-block{
margin-bottom: 30px;
}
section.color-box{
width: 80%;
margin: 0 auto 40px;
padding: 5%;
color: #403c34;
}

/* article-B
-------------------------------------*/
article.article-B div.column-block{
margin-bottom: 40px;
}

/* article-C
-------------------------------------*/
article.article-C table.table-block-01{
width: 100%;
margin-bottom: 10px;
background: #f2f2f2;
border-collapse: collapse;
}
article.article-C div.left-block,
article.article-C div.right-block{
width: 100%;
}
article.article-C table.table-block-01 thead tr th{
padding: 8px 0;
background: #333;
color: #fff;
text-align: center;
}
article.article-C table.table-block-01 tbody tr{
border-top: 1px solid #b6b6b6;
}
article.article-C table.table-block-01 tbody th{
padding: 9px 0;
width: 60px;
text-align: center;
vertical-align: text-top;
border-right: 1px solid #b6b6b6;
}
article.article-C table.table-block-01 tbody td{
width: auto;
padding: 9px;
}
article.article-C p.button-01{
margin-bottom: 40px;
}
article.article-C p.button-01 a{
width: 95%;
padding: 0.5em 0;
font-size: 100%;
}
@media screen and (max-width: 359px){
article.article-C p.button-01 a{
width: 98%;
font-size: 94%;
}
}

/* article-D
-------------------------------------*/
article.article-D ol.ol-list-01{
padding: 0 20px;
}
article.article-D ol.ol-list-01 li dl.column-block dt h3{
display: flex;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
justify-content: left;
align-items: center;
}
.badge.bg-orange{
writing-mode: vertical-rl;
height: 70px;
padding: 0 0.5em;
}
article.article-D ol.ol-list-01 li dl dd{
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid #bfbfbf;
}
article.article-D ol.ol-list-01 li:last-of-type dl dd{
border-bottom: none;
}


/* form
-------------------------------------*/
section.form{
padding: 0 20px 0;
}
.badge.bg-black{
margin-bottom: 10px;
}
section.form nav.step ul{
overflow: hidden;
}
section.form nav.step ul li{
width: 25.9%;
margin: 0 0.5em 0 1em;
padding: 10px 0;
font-size: 88%;
background: #86c9f9;
color: #fff;
text-align: center;
position: relative;
float: left;
}
section.form nav.step ul li:before{
content: "";
margin-top: -1.5em;
border-width: 1.5em 0 1.5em 1em;
border-style: solid;
border-color: #86c9f9 #86c9f9 #86c9f9 transparent;
position: absolute;
top: 50%;
left: -1em;
}
section.form nav.step ul li:after{
content: "";
margin-top: -1.5em;
border-top: 1.5em solid transparent;
border-bottom: 1.5em solid transparent;
border-left: 1em solid #86c9f9;
position: absolute;
top: 50%;
right: -1em;
}
section.form nav.step ul li.now{
background: #3fa9f5;
color: #fff;
font-weight: bold;
}
section.form nav.step ul li.now:before{
content: "";
margin-top: -1.5em;
border-width: 1.5em 0 1.5em 1em;
border-style: solid;
border-color: #3fa9f5 #3fa9f5 #3fa9f5 transparent;
position: absolute;
top: 50%;
left: -1em;
}
section.form nav.step ul li.now:after{
content: "";
margin-top: -1.5em;
border-top: 1.5em solid transparent;
border-bottom: 1.5em solid transparent;
border-left: 1em solid #3fa9f5;
position: absolute;
top: 50%;
right: -1em;
}
section.form dl{
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid #eeeeee;
display: block;
}
section.form dl dt span.required,
section.form dl dt span.any{
margin-right: 0.75em;
padding: 0.25em 0.5em;
background: #c00;
font-size: 75%;
color: #fff;
vertical-align: middle;
border-radius: 5px;
}
section.form dl dt span.any{
background: #666;
}
section.form dl dt{
width: 100%;
margin-bottom: 10px;
vertical-align: middle;
font-weight: bold;
}
section.form dl dd{
width: 100%;
}
section.form dl dd input[type=text],
section.form dl dd input[type=tel],
section.form dl dd input[type=number],
section.form dl dd input[type=email],
section.form dl dd select,
section.form dl dd textarea{
width: 93%;
padding: 0.5em;
background: #f8f8f8;
border: 1px solid #ddd;
border-radius: 3px;
box-shadow: 0 2px 2px rgba(0,0,0,0.03) inset;
}
section.form input.reflect{
min-width: 10%;
padding: 0.5em 1em;
background: linear-gradient(#eee,#ccc);
color: #555;
font-weight: bold;
vertical-align: top;
border: 1px solid #bbb;
border-radius: 3px;
cursor: pointer;
}
section.form input.reflect:hover{
background: linear-gradient(#ccc,#eee);
}
section.form dd.radio input, section.form dd.checkbox input {
width: 25px;
margin-right: 0.25em;
vertical-align: middle;
transform: scale(1.8);
-webkit-transform: scale(1.8);
}
section.form dl dd textarea{
resize: vertical;
height: 200px;
min-height: 200px;
max-height: 350px;
}
section.form p.submit,
section.form p{
text-align: center;
}
section.form p input[type="submit"],
section.form p input[type=button]{
width: 80%;
padding: 0.75em 0;
background: #fff;
color: #ff931e;
font-weight: bold;
text-align: center;
text-decoration: none;
vertical-align: middle;
border: 2px solid #ff931e;
border-radius: 5px;
cursor: pointer;
}
section.form p input[type="submit"]:hover,
section.form p input[type=button]:hover{
color: #fff;
background: #ff931e;
}

/* form kakunin
-------------------------------------*/
section.form dl#newline{
width: 100%;
margin: 0 auto;
}
section.form dl#newline dt{
margin-top: 20px;
padding-top: 20px;
border-top: 1px solid #eeeeee;
}
section.form dl#newline dd{
color: #666;
}
section.form input.syusei{
margin-bottom: 5px;
}
section.form2 p input[type="submit"]{
width: 48%;
float: right;
}
section.form2 p input[type=button]{
width: 48%;
float: left;
}


/* form kanryo
-------------------------------------*/
section.form2 p.thanks{
text-align: left;
}
section.form2 p{
text-align: center;
margin-bottom: 20px;
}
section.form2 p.button01{
margin: 60px auto 0;
}