@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(min-width:960px){

/*STYLE*/
.tb,.sp {
display:none;
}

p {
font-size:1rem;
font-weight:400;
line-height:150%;
letter-spacing:0.5px;
}

img {
width:100%;
height:auto;
}

.wrap {
overflow-x:hidden;
}



/*MV*/
#mv {
width:100%;
height:700px;
position:relative;
background:url(../img/mv_bg.jpg);
background-size:cover;
background-position:center;
}

#mv .logo {
width:200px;
position:absolute;
top:25px;
left:25px;
display:flex;
align-items:center;
}

#mv .contact {
width:250px;
position:absolute;
top:25px;
right:25px;
}

#mv .photos {
width:100%;
height:700px;
display:flex;
align-items:center;
}

#mv .swiper-container {
display:flex;
align-items:center;
padding:12px 0;
background:#fff;
box-shadow:rgba(0,0,0,0.1) 0 0 15px;
}

#mv .cts {
width:1000px;
height:700px;
margin:auto;
position:absolute;
top:0;
left:0;
right:0;
}

#mv .cts .mv {
width:840px;
position:absolute;
bottom:0;
left:-70px;
z-index:99;
}

#mv .cts .introduction {
width:600px;
height:520px;
background:rgba(255,255,255,0.9);
position:absolute;
right:0;
top:120px;
bottom:0;
z-index:99;
padding:35px 50px;
border:rgba(180,150,50,0.5) 1px solid;
}

#mv .cts .introduction .subtitle1 {
font-size:160%;
font-weight:bold;
text-align:center;
padding-bottom:10px;
}

#mv .cts .introduction .subtitle1 .point {
position:relative;
}

#mv .cts .introduction .subtitle1 .point:before {
content:"";
width:6px;
height:6px;
border-radius:3px;
background:#e50012;
position:absolute;
top:-8px;
left:0;
right:0;
margin:auto;
}

#mv .cts .introduction .subtitle2 {
font-size:160%;
font-weight:bold;
background:#003278;
color:#fff;
text-align:center;
padding:7px;
margin-bottom:18px;
}

#mv .cts .introduction .title1 {
width:100%;
margin:0 auto 20px;
}

#mv .cts .introduction .title2 {
width:100%;
margin-bottom:15px;
}

#mv .cts .introduction .ex {
font-size:105%;
font-weight:bold;
line-height:200%;
text-align:left;
padding-bottom:7px;
}

#mv .cts .introduction .ex .marker {
font-size:125%;
font-weight:bold;
color:#e50012;
position:relative;
}

#mv .cts .introduction .ex .marker:after {
content:"";
width:100%;
height:1px;
background:#e50012;
position:absolute;
bottom:-3px;
left:0;
right:0;
margin:auto;
z-index:-1;
}

#mv .cts .introduction .summary {
display:flex;
justify-content:space-between;
align-items:center;
}

#mv .cts .introduction .summary .line {
width:80px;
height:1px;
background:#003278;
}

#mv .cts .introduction .summary p {
font-size:180%;
font-weight:bold;
text-align:center;
color:#003278;
}

#mv .medal {
width:180px;
position:absolute;
left:20px;
bottom:20px;
z-index:99;
}



/*CTA*/
#cta {
width:100%;
height:100px;
background:url(../img/cta.png);
background-color:rgba(0,0,0,0.85);
position:fixed;
bottom:0;
display:flex;
justify-content:center;
align-items:center;
z-index:998;
transition:0.7s;
}

#cta.close {
transform:translate(0,100%);
transition:0.7s;
}

#cta .cts {
width:100%;
text-align:center;
}

#cta .cts .btn {
display:inline-block;
}

#cta .cts .btn a {
height:60px;
display:flex;
align-items:center;
justify-content:center;
background:#e50012;
border-radius:6px;
padding:0 50px;
}

#cta .cts .btn p {
font-size:150%;
font-weight:bold;
color:#fff;
text-align:center;
letter-spacing:2px;
}

#cta .cts .btn p .seminar {
padding-right:20px;
font-size:90%;
}

#cta .cts .btn p .free {
background:#fff;
margin-left:20px;
color:#e50012;
padding:5px 10px;
font-size:80%;
}



/*COMMON*/
.titles {
padding-bottom:50px;
}

.titles .icon {
width:60px;
margin:0 auto 15px;
}

.titles h2 {
text-align:center;
font-size:250%;
font-weight:bold;
padding-bottom:20px;
}

.titles .line {
margin:auto;
background:#003278;
}

.cts {
width:1000px;
margin:auto;
}

.flame {
width:50px;
position:absolute;
}

.flame.tl {
top:-5px;
left:-5px;
}

.flame.tr {
top:-5px;
right:-5px;
}

.flame.rb {
bottom:-5px;
right:-5px;
}

.flame.bl {
bottom:-5px;
left:-5px;
}



/*ABOUT*/
#about {
background:#f9f9f9 url(../img/about_bg.jpg) no-repeat center bottom;
padding:70px 0 350px;
}

#about .cases {
display:flex;
justify-content:space-between;
flex-wrap:wrap;
}

#about .cases .case {
width:480px;
height:100px;
position:relative;
border:#003278 1px dotted;
background:#fff;
margin-bottom:35px;
border-radius:20px;
display:flex;
justify-content:center;
align-items:center;
padding-top:10px;
}

#about .cases .case .check {
position:absolute;
width:40px;
top:-17px;
left:0;
right:0;
margin:auto;
}

#about .cases .case .aruaru {
text-align:center;
color:#003278;
font-size:120%;
font-weight:bold;
}

.next {
width:100%;
height:180px;
background:#e50012;
position:relative;
display:flex;
justify-content:center;
align-items:flex-end;
}

.next .summary {
font-size:180%;
font-weight:bold;
text-align:center;
color:#fff;
}

.next:after {
content:"";
width:100%;
height:70px;
position:absolute;
border-top:#e50012 70px solid;
border-right:transparent 50vw solid;
border-bottom:transparent 70px solid;
border-left:transparent 50vw solid;
bottom:-140px;
z-index:1;
}



/*MESSAGE*/
#message {
position:relative;
padding:0;
background:url(../img/message_bg.jpg) no-repeat center;
background-size:cover;
background-attachment:fixed;
}

#message .bg {
width:100%;
height:100%;
background:url(../img/mask.png);
position:absolute;
top:0;
left:0;
}

#message .titles {
padding-bottom:80px;
}

#message .cts {
padding:140px 0 100px;
position:relative;
z-index:1;
}

#message .messages {
}

#message .messages .message {
width:1000px;
position:relative;
background:rgba(255,255,255,0.9);
padding:85px 70px 70px;
border:rgba(180,150,50,0.5) 1px solid;
margin-bottom:100px;
}

#message .messages .message:last-child {
margin-bottom:0;
}

#message .messages .message .number {
width:220px;
position:absolute;
top:-31px;
left:0;
right:0;
margin:auto;
}

#message .messages .message .details {
display:flex;
justify-content:space-between;
padding-bottom:40px;
}

#message .messages .message .details .photo {
width:300px;
}

#message .messages .message .details .detail {
width:510px;
}

#message .messages .message .details .detail .names {
margin-bottom:30px;
border-left:#003278 5px solid;
padding:10px 0 7px 15px;
}

#message .messages .message .details .detail .names .profile {
padding-bottom:5px;
}

#message .messages .message .details .detail .names .profile .name {
font-size:180%;
font-weight:bold;
line-height:100%;
}

#message .messages .message .details .detail .names .profile .age {
}

#message .messages .message .details .detail .names .job {
}

#message .messages .message .details .detail .names .job .item {
color:#b4b4b4;
}

#message .messages .message .details .detail .comment {
line-height:180%;
}

#message .messages .message .evidence {
}

#message .messages .message .evidence img {
border:#e1e1e1 1px solid;
}



/*SEMINAR*/
#seminar {
background:url(../img/seminar_bg.png);
position:relative;
overflow:hidden;
}

#seminar .obj_a {
width:250px;
position:absolute;
top:-15px;
left:-30px;
opacity:0.5;
}

#seminar .obj_b {
width:350px;
position:absolute;
top:-50px;
right:-100px;
opacity:0.5;
}

#seminar .obj_c {
width:350px;
position:absolute;
bottom:-50px;
left:-30px;
opacity:0.5;
}

#seminar .cts {
padding:70px 0 150px;
position:relative;
}

#seminar .titles h2 {
color:#fff;
}

#seminar .titles .line {
background:#f5e100;
}

#seminar .board {
width:1000px;
margin:auto;
background:rgba(255,255,255,1);
padding:50px;
position:relative;
border:rgba(180,150,50,0.5) 1px solid;
}

#seminar .board .programs {
position:relative;
z-index:1;
}

#seminar .board .programs .program {
display:flex;
justify-content:flex-start;
align-items:center;
margin-bottom:15px;
border:#003278 1px dashed;
padding:18px 25px;
width:660px;
background:rgba(255,255,255,0.9);
}

#seminar .board .programs .program:last-child {
margin-bottom:0;
}

#seminar .board .programs .program .check {
width:35px;
margin-right:15px;
}

#seminar .board .programs .program .item {
font-size:150%;
font-weight:bold;
}

#seminar .lecturer {
width:800px;
position:absolute;
right:-100px;
bottom:0;
}



/*FLOW*/
#flow {
background:url(../img/flow_bg.jpg) no-repeat;
background-size:cover;
background-position:center;
background-attachment:fixed;
position:relative;
padding:70px 0;
}

#flow .titles {
padding-bottom:50px;
}

#flow .bg {
width:100%;
height:100%;
background:url(../img/mask.png);
position:absolute;
top:0;
left:0;
opacity:0.2;
}

#flow .steps {
}

#flow .steps .step {
background:#fff;
box-shadow:rgba(0,0,0,0.1) 0 0 15px;
margin-bottom:50px;
position:relative;
padding:10px;
}

#flow .steps .step:after {
content:"";
width:40px;
height:50px;
background:#f09600;
position:absolute;
bottom:-50px;
left:0;
right:0;
margin:auto;
}

#flow .steps .step:last-child {
margin-bottom:0;
}

#flow .steps .step:last-child:after {
display:none;
}

#flow .steps .step .frame {
border:#f09600 1px dashed;
padding:10px 20px;
display:flex;
justify-content:space-between;
align-items:center;
}

#flow .steps .step .frame .number {
width:130px;
}

#flow .steps .step .frame .detail {
width:600px;
}

#flow .steps .step .frame  .detail .item {
font-size:150%;
font-weight:bold;
color:#f09600;
padding-bottom:7px;
}

#flow .steps .step .frame  .detail .ex {

}

#flow .steps .step .frame .icon {
width:150px;
}



/*CONTACT*/
#contact {
background:#f5f5f5;
padding:70px 0;
}

#contact .copy {
font-size:110%;
font-weight:bold;
text-align:center;
padding-bottom:10px;
}

#contact .attention {
font-size:90%;
text-align:center;
}

#contact .prices {
width:320px;
margin:20px auto 30px;
display:flex;
justify-content:center;
align-items:center;
border:#e50012 1px dashed;
background:#fff;
}

#contact .prices .item {
width:100px;
background:#e50012;
color:#fff;
text-align:center;
padding:15px 10px;
}

#contact .prices .price {
width:220px;
text-align:center;
}

#contact .forms {
}

#contact .forms .form {
border-bottom:#c8c8c8 1px solid;
display:flex;
padding-bottom:20px;
margin-bottom:20px;
}

#contact .forms .form:first-child {
border-top:#c8c8c8 1px solid;
padding-top:20px;
margin-top:20px;
padding-bottom:10px;
}

#contact .forms .form .items {
width:30%;
display:flex;
align-items:center;
padding-left:10px;
}

#contact .forms .form .items .required {
border:#e50012 1px solid;
display:inline-block;
color:#e50012;
font-size:70%;
padding:3px 5px;
margin-right:10px;
}

#contact .forms .form .items .item {
}

#contact .forms .form .detail {
width:70%;
font-weight:400;
}

input {
padding:15px 20px;
margin-right:15px;
}

#contact .style_date {
}

#contact .style_name {
width:30%;
}

#contact .style_kana {
width:30%;
}

#contact .style_tel {
width:40%;
}

#contact .style_mail {
width:80%;
}

#contact .style_submit {
padding:25px 100px;
font-size:150%;
background:#32aa32;
-webkit-animation:bound 1s infinite ease alternate;
animation:bound 1s ease infinite alternate;
color:#fff;
font-weight:bold;
border:none;
border-radius:10vw;
cursor:pointer;
}

#contact .style_submit:hover {
-webkit-animation:hover 0.5s ease forwards;
animation:hover 0.5s ease forwards;
}

#contact .style_fix {
background:#bbb;
color:#fff;
font-weight:bold;
border:none;
border-radius:10vw;
padding:20px 50px;
cursor:pointer;
margin-right:20px;
}

input[type="radio"] {
visibility:hidden;
position:absolute;
}

input[type="radio"]:checked {
}

.style_date + label {
background:#fff;
border:#c8c8c8 1px dotted;
padding:15px 30px;
display:inline-block;
border-radius:10vw;
cursor:pointer;
font-weight:400;
margin:0 10px 10px 0;
}

.style_date:checked + label {
background:#e50012;
border:#c8c8c8 1px dotted;
color:#fff;
}

#contact .summary {
font-size:90%;
text-align:center;
padding:15px 0 30px;
}

#contact .btns {
display:flex;
justify-content:center;
}



/*FINISH*/
#finish {
background:#f5f5f5;
padding:100px 0;
}

#finish .detail {
}

#finish .detail .copy1 {
padding-bottom:30px;
text-align:center;
font-weight:bold;
}

#finish .detail .mail_title {
border:#e50012 1px dashed;
padding:15px 25px;
margin-bottom:15px;
width:700px;
margin:0 auto 15px;
background:#fff;
}

#finish .detail .mail_from {
border:#e50012 1px dashed;
padding:15px 25px;
margin-bottom:15px;
margin-bottom:15px;
width:700px;
margin:0 auto 30px;
background:#fff;
}

#finish .detail .copy2 {
text-align:center;
}

#finish .btns {
padding-top:100px;
text-align:center;
}

#finish .btns .btn {
display:inline-block;
}

#finish .btns .btn a {
display:flex;
justify-content:center;
align-items:center;
border:#000 1px dashed;
padding:10px 25px;
border-radius:10vw;
}

#finish .btns .btn a .arrow {
width:10px;
height:10px;
border-top:#000 1px solid;
border-right:transparent 1px solid;
border-bottom:transparent 1px solid;
border-left:#000 1px solid;
transform:rotate(-45deg);
margin-right:10px;
}

#finish .btns .btn a p {
font-size:90%;
}



/*FAQ*/
#faq {
padding:70px 0 200px;
background:url(../img/faq_bg.jpg) no-repeat;
background-position:center bottom;
background-size:100%;
}

#faq .faqs {
}

#faq .faqs .faq {
margin-bottom:50px;
}

#faq .faqs .faq .question {
display:flex;
border:#003278 1px dashed;
margin-bottom:15px;
}

#faq .faqs .faq .question .q {
background:#003278;
color:#fff;
width:50px;
height:50px;
display:flex;
justify-content:center;
align-items:center;
}

#faq .faqs .faq .question .detail {
background:#f2f5f8;
color:#003278;
font-size:100%;
font-weight:bold;
width:calc(100% - 50px);
display:flex;
justify-content:flex-start;
align-items:center;
padding-left:15px;
}

#faq .faqs .faq .answer {
display:flex;
justify-content:space-between;
}

#faq .faqs .faq .answer .a {
border:#003278 1px dashed;
color:#003278;
width:50px;
height:50px;
display:flex;
justify-content:center;
align-items:center;
}

#faq .faqs .faq .answer .detail {
width:calc(100% - 65px);
}



/*MIDDLE CTA*/
#middle_cta {
width:100%;
background:url(../img/cta.png);
background-color:rgba(0,0,0,0.85);
display:flex;
justify-content:center;
align-items:center;
}

#middle_cta .cts {
width:100%;
text-align:center;
padding:70px 0;
}

#middle_cta .cts .copy {
font-size:135%;
font-weight:bold;
color:#fff;
padding-bottom:30px;
line-height:180%;
}

#middle_cta .cts .btn {
display:inline-block;
-webkit-animation:bound 1s infinite ease alternate;
animation:bound 1s ease infinite alternate;
}

#middle_cta .cts .btn a {
height:80px;
display:flex;
align-items:center;
justify-content:center;
background:#e50012;
border-radius:6px;
padding:0 50px;
}

#middle_cta .cts .btn p {
font-size:180%;
font-weight:bold;
color:#fff;
text-align:center;
letter-spacing:2px;
}

#middle_cta .cts .btn p .seminar {
padding-right:20px;
font-size:90%;
}

#middle_cta .cts .btn p .free {
background:#fff;
margin-left:20px;
color:#e50012;
padding:5px 10px;
font-size:80%;
}



/*INTRO*/
#intro {
padding:70px 0 0;
}

#intro .about {
width:1000px;
height:340px;
display:flex;
justify-content:space-between;
align-items:center;
flex-direction:row-reverse;
background:#003278;
margin-bottom:35px;
}

#intro .about .photos {
width:500px;
display:flex;
flex-wrap:wrap;
padding-bottom:0;
}

#intro .about .photos .photo {
}

#intro .about .copies {
width:500px;
padding:45px 40px;
}

#intro .about .copies .copy {
font-size:145%;
font-weight:bold;
color:#fff;
padding-bottom:25px;
letter-spacing:1px;
line-height:180%;
}

#intro .about .copies .ex {
color:#fff;
line-height:180%;
}

#intro .profiles {
display:flex;
justify-content:space-between;
flex-direction:row-reverse;
padding-bottom:50px;
}

#intro .profiles .book {
width:160px;
}

#intro .profiles .book img {
border:#c8c8c8 1px solid;
}

#intro .profiles .profile {
width:800px;
}

#intro .profiles .profile p {
padding-bottom:30px;
font-size:110%;
line-height:180%;
letter-spacing:1px;
}

#intro .photos {
display:flex;
padding-bottom:70px;
}

#intro .media .title {
position:relative;
display:flex;
justify-content:center;
align-items:center;
margin-bottom:30px;
}

#intro .media .title .hor {
width:100%;
height:1px;
background:#000;
position:absolute;
z-index:-1;
}

#intro .media .title h3 {
font-size:150%;
font-weight:bold;
background:#fff;
padding:0 30px;
}

#intro .media .media_image {
width:900px;
margin:0 auto 50px;
}

#intro .media .logos {
display:flex;
flex-wrap:wrap;
padding-bottom:50px;
}

#intro .media .logos .logo {
width:20%;
}

#intro .tels {
}

#intro .tels .items {
display:flex;
justify-content:center;
align-items:center;
position:relative;
margin-bottom:20px;
}

#intro .tels .items .hor {
width:100%;
height:1px;
background:#000;
position:absolute;
z-index:-1;
}

#intro .tels .items .item {
font-size:135%;
font-weight:bold;
background:#fff;
padding:0 20px;
}

#intro .tels .tel {
width:700px;
margin:0 auto 20px;
}

#intro .times {
display:flex;
justify-content:center;
align-items:center;
border-bottom:#000 1px solid;
padding-bottom:20px;
}

#intro .times .item {
font-size:70%;
border:#000 1px solid;
padding:3px 5px;
margin-right:10px;
}

#intro .times .time {
font-size:90%;
}



/*BACK TO TOP*/
.BackToTop {
position:fixed;
width:40px;
height:40px;
right:25px;
bottom:30px;
z-index:999;
display:none;
}



/*FOOTER*/
footer {
padding:50px 0 30px;
}

footer.under {
padding:35px 0 30px;
}

footer .link {
font-size:90%;
text-align:center;
padding-bottom:30px;
}

footer.under .link {
padding-bottom:25px;
}

footer .copyright {
text-align:center;
font-size:90%;
color:#aaa;
}



}