/* @media (min-width: 1200px) {
.container
{
max-width: 980px;
}
}*/

/*----- レイアウト調整 -----*/
.step-wrap
{
width: 100%;
height: auto;
padding: 2%;
background-color: #fff;
}

.parent {
  position: relative;
}
.child {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%); /* Safari用 */
  transform: translate(-50%, -50%);
}

.width-660{
max-width: 660px !important;
}

/*----- /レイアウト調整 -----*/
h1
{
text-align: center !important;
color: #50a8b4;
filter: drop-shadow(1px 1px 1px rgba(0,0,0,.3));
}
.color-WH
{
color: #fff !important;
}
.text-size100
{
font-size: 1rem !important;
}
/*-----BTN-SECTION-----*/
.btn-wrap
{
margin-top: 8%;
margin-bottom: 8%;
}
.btn
{
height: auto;
margin-top: 0.625rem;
margin-right: auto;
margin-bottom: 0.625rem;
margin-left: auto;
padding-top: 1.25rem;
padding-right: 0;
padding-bottom: 1.25rem;
padding-left: 0;
border-radius: 6.25rem;
}
.btncol-1
{
font-weight: bold;
color: #fff;
border-width: 1px;
border-color: #39496d !important;
background-color: #39496d !important;
}
.btncol-2
{
font-weight: bold;
color: #fff;
border-width: 1px;
border-color: #6a83ba !important;
background-color: #6a83ba !important;
}
.btncol-3
{
font-weight: bold;
color: #fff;
border-width: 1px;
border-color: #85b1df !important;
background-color: #85b1df !important;
}
.btncol-4
{
font-weight: bold;
color: #fff;
border-width: 1px;
border-color: #50a8b4 !important;
background-color: #50a8b4 !important;
}
.btncol-1:hover,
.btncol-2:hover,
.btncol-3:hover,
.btncol-4:hover
{
color: #fff;
border: 1px solid #e8862d !important;/*filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;*/
background-color: #e8862d !important;
}


/*使わないかも*/
.btncol-5
{
font-weight: bold;
color: #fff;
border-width: 1px;
border-color: #e8862d !important;
background-color: #e8862d !important;
/*max-width:300px !important;*/
}

.btncol-6
{
font-weight: bold;
color: #fff;
border-width: 1px;
border-color: #666666 !important;
background-color: #666666 !important;
/*max-width:300px !important;*/
}

.btncol-5:hover,
.btncol-6:hover
{
color: #fff;
border: 1px solid #39496d !important;/*filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;*/
background-color: #39496d !important;
}
/*使わないかも*/


/*-----BTN-SECTION-----*/
.mt-5
{
margin-top: 6%!important;
}
.mb-5
{
margin-bottom: 6%!important;
}
.bg-light
{
/*border-radius: 6.25rem;*/
background-color: /*#e7f7f7!important*/ #fff!important;
border-top: 3px dashed #ccc;
}
nav a
{
 font-size: .85rem;
font-weight: bold;
text-decoration: none !important;
color: #212529 !important;
}
.drop-shadow
{
filter: drop-shadow(1px 1px 6px rgba(0,0,0,.6));
}
@media screen and (max-width: 770px) {
h1
{
font-size: 160% !important;
/*text-align: left !important;*/
color: #50a8b4;
filter: drop-shadow(0px 0px 0px rgba(0,0,0,.3));
}
.btn
{
height: auto;
margin-top: 0.625rem;
margin-right: auto;
margin-bottom: 0.625rem;
margin-left: auto;
padding-top: 0.625rem;
padding-right: 0;
padding-bottom: 0.625rem;
padding-left: 0;
border-radius: 6.25rem;
}
}
.btn.focus,
.btn:focus
{
outline: 0;
-webkit-box-shadow: 0 0 0 0 rgba(2,117,216,.25) !important;
box-shadow: 0 0 0 0 rgba(2,117,216,.25) !important;
}
#id_selector:focus
{
border: none;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
img
{
max-width: 100%;
}
/* -------------------------*/
.ruby{
	font-size: 60% !important;
	text-align: center;
	display: block;
	padding: 5px;
	color: #C00;
}

.btn-ruby{
	font-size: 60% !important;
	text-align: center;
	display: block;
	padding: 0px;
	color: #FFF;
	font-weight: normal !important;
}