﻿@charset "utf-8";
/*------------------------------------------------------------

緑テンプレ

------------------------------------------------------------*/
/*-- HEADER/FOOTER --*/
header {
    background-color: #ffffff;
    /* border-bottom: 2px solid #063852; */
}
footer .copy {
    background: #063852;
}
footer {
    background-color: #EFF9FF;
}
.title--head {
    color: #444444;
    border-left: solid 5px #063852;
}
/*-- STEP --*/
.cp_stepflow > li {
	color: #b0bec5;
}
.cp_stepflow > li .bubble {
	background-color: #b0bec5;
}
.cp_stepflow > li .bubble::after,
.cp_stepflow > li .bubble::before {
	background-color: #b0bec5;
}
.cp_stepflow > li.completed,
.cp_stepflow > li.completed .bubble {
    color: #4B6EC0;
}
.cp_stepflow > li.completed .bubble,
.cp_stepflow > li.completed .bubble::after,
.cp_stepflow > li.completed .bubble::before {
    background-color: #4B6EC0;
}
.cp_stepflow > li.active,
.cp_stepflow > li.active .bubble {
	color: #F98866;
}
.cp_stepflow > li.active .bubble,
.cp_stepflow > li.active .bubble::after,
.cp_stepflow > li.active .bubble::before {
	background-color: #F98866;
}

/*----- NAVI -----**/
#nav-menu {
    background-color: #063852;
}
@media screen and (min-width: 769px) {
    #h-nav ul li {
        border-left: 1px solid #fff;
        border-right: 1px solid #fff;
    }
    #h-nav ul li + li {
        border-left: 0;
        border-right: 1px solid #fff;
    }
}
#h-nav ul li a {
    color: #fff;
}
#h-nav ul li a:hover {
    background-color: #F0810F;
}
#nav-toggle {
    background-color: #063852;
}
#nav-toggle > p {
    color: #fff;
}
#nav-toggle span {
    background: #fff;
}
/*----- BUTTON -----**/
.btn--next {
    border: 1px solid #063852;
    background-color: #063852;
    color: #fff;
}
.btn--next:hover {
    background-color: #fff;
    color: #063852;
}
.btn--back {
    border: 1px solid #747474;
    background-color: #747474;
    color: #fff;
}
.btn--back:hover {
    background-color: #fff;
    color: #747474;
}
.h-nav__next a {
    color: #fff;
}
.h-nav__back a {
    color: #fff;
}
/*----- TITLE -----**/
.title--sec1::before {
    background: #0A567A;
    background: -webkit-linear-gradient(-45deg, transparent, #0A567A 10%, #0A567A 90%, transparent);
    background: linear-gradient(-45deg, transparent, #0A567A 10%, #0A567A 90%, transparent);
}
.title--sec2 {
    border-left: 6px solid #0A567A;
    border-bottom: 1px solid #0A567A;
}
.title--sec3 {
    border-bottom: 1px solid #0A567A;
}
.title--sec3::after {
    background-color: #0A567A;
}
.title--page {
    background: #EFF9FF;
}
