@charset "utf-8";

/* ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■

【SP】ウィンドウ幅が768px以下の場合に適用するCSS

■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ */
@media screen and (max-width: 768px) {



/* ========================================

【メインビジュアル】

======================================== */
#LP .mv {
background: url("../img/mv/img_01.jpg") no-repeat scroll center center;
background-size: cover;
position: relative;
height: 300px;
}
#LP .mv img {
position: absolute;
    width: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -25%);
}



/* ========================================

lp_01 メインプラン

======================================== */
#LP .lp_01 {
    background: #eee;
    background-size: cover;
    padding: 30px 5%;
}

#LP .lp_01 .main_title {
text-align: center;
}
#LP .lp_01 .main_title .title_deco_01 {
font-size: 1.2em;
    line-height: 1.3;
}
#LP .lp_01 .main_title .title_deco_01 .mini {
font-size: 0.7em;
}
#LP .lp_01 .main_title .title_deco_01 .color {
color: #e6501e;
font-size: 1.3em;
}
#LP .lp_01 .main_title .title_deco_01 span:nth-child(4) {
margin: 0 -10px;
}

#LP .lp_01 .main_title p {
width: 100%;
text-align: left;
padding: 0 0 30px;
}

#LP .lp_01 .plan_list {
}
#LP .lp_01 .plan_list li {
background:  #fff;
margin: 0 0 20px 0;
}

#LP .lp_01 .plan_list .img {
}
#LP .lp_01 .plan_list img {
}
#LP .lp_01 ul .text {
padding: 10px 5% 20px;
}
#LP .lp_01 .plan_list .line {
font-size: 1.4em;
    line-height: 1.5;
    margin: 0 0 40px 0;
    text-align: center;
    width: 100%;
}
#LP .lp_01 .plan_list p {
line-height: 1.6;
}
#LP .lp_01 .plan_list p span {
font-size: 1.2em;
}

#LP .lp_01 .plan_list li:first-child .line:before,
#LP .lp_01 .plan_list li:last-child .line:before {
}

#LP .lp_01 .plan_list li:first-child .line:before {
background-color: #fa822c;
}
#LP .lp_01 .plan_list li:first-child p span {
color: #fa822c;
}

#LP .lp_01 .plan_list li:last-child .line:before {
background-color:#e65078;
}
#LP .lp_01 .plan_list li:last-child p span {
color: #e65078;
}



/* ========================================

lp_01 募集期間

======================================== */
#LP .lp_01 .period ul {
}
#LP .lp_01 .period li {
    width: 100%;
    margin: 0 0 20px 0;
    padding: 10px 3%;
    background: #fff;
    box-sizing: border-box;
    text-align: center;
}
#LP .lp_01 .period .title {
    color: #e6501e;
    margin: 0 0 -5px 0;
}

#LP .lp_01 .period .day {
    letter-spacing: 1px;
}
#LP .lp_01 .period .day span {
    font-size: 1.7em;
}

#LP .lp_01 .period .note {
text-align: center;
    margin: 30px 0 0 0;
}
#LP .lp_01 .period .note a {
text-decoration: underline;
}
#LP .lp_01 .period .note a:hover {
text-decoration: none;
}

#LP .note {
font-size: 0.9em;
}

#LP .font_l {
text-align: left;
}


/* ========================================

lp_02 

======================================== */
#LP .lp_02 {
}

#LP .lp_02 .plan_details {
margin: 30px 0;
}

#LP .lp_02 .plan_details .plan_name {
margin: 0 0 50px 0;
}

#LP .lp_02 .plan_details .text .text_01 .line {
font-size: 1.6em;
    line-height: 1.5;
    display: block;
}

#LP .lp_02 .plan_details .text .text_02 {
display: flex;
    padding: 0 5%;
}

#LP .lp_02 .plan_details .plan_name .img img {
width: 100%;
height: 100%;
object-fit: cover;
}

#LP .lp_02 .plan_details .plan_name .img {
    width: 100%;
    height: 250px;
    padding: 0 5%;
    box-sizing: border-box;
}
#LP .lp_02 .plan_details .text {
width: 100%;
}
#LP .lp_02 .plan_details .text p {
font-size: 1.1em;
line-height: 2;
}

#LP .lp_02 .plan_details .text .text_02 .col_img {
width: 50%;
height: auto;
}
#LP .lp_02 .plan_details .text .text_02 .col_img img {
width: 100%;
}

#LP .lp_02 .plan_details .text .text_01 {
padding: 20px 5%;
}


#LP .lp_02 .plan_details .plan_name .pdf {
padding: 30px 0 0 0;
}
#LP .lp_02 .plan_details .plan_name .pdf a {
display: flex;
}

#LP .lp_02 .plan_details .plan_name .pdf a:hover {
opacity: 0.8;
}
#LP .lp_02 .plan_details .plan_name .pdf a:hover {
}

#LP .lp_02 .plan_details .plan_name .pdf .pdf_img {
margin: 0 20px 0 0;
}
#LP .lp_02 .plan_details .plan_name .pdf .pdf_img img {
width: 100px;
}
#LP .lp_02 .plan_details .plan_name .pdf .pdf_text span {
font-size: 1.2em;
    position: relative;
    padding: 0 0 0 15px;
    display: block;
    margin: 0 0 5px 0;
}
#LP .lp_02 .plan_details .plan_name .pdf .pdf_text span:after {
    content: "";
    height: 5px;
    width: 5px;
    border-bottom: 2px solid #e65078;
    border-right: 2px solid #e65078;
    transform: rotate(-45deg);
    position: absolute;
    left: 0;
    top: 12px;
}
#LP .lp_02 .plan_details .plan_name .pdf .pdf_text p {
line-height: 1.5;
}




/* plan_01
========================== */
#LP .lp_02 .plan_01 .text .text_02 img:first-child {
}
#LP .lp_02 .plan_01 .text .text_01 .line span {
color: #e6501e;
}
#LP .lp_02 .plan_01 .text .text_01 .line:before {
left: 0;
transform: translate(0,0);
background-color: #e6501e;
width: 100px;
}
#LP .lp_02 .plan_01 .text .text_01 .line:after {
content: url("../img/text_deco_0201.svg");
width: 35vw;
    position: absolute;
    right: 0;
    top: -10px;
}


/* plan_02
========================== */
#LP .lp_02 .plan_02 .text .text_01 .line span {
color: #e65078;
}
#LP .lp_02 .plan_02 .text .text_01 .line:before {
left: 0;
transform: translate(0,0);
background-color: #e65078;
width: 100px;
}
#LP .lp_02 .plan_02 .text .text_01 .line:after {
content: url("../img/text_deco_0202.svg");
width: 20vw;
    position: absolute;
left: -230px;
    top: -40px;
}



/* ========================================

plan_price

======================================== */
#LP .lp_02 .plan_details .plan_price {
padding: 30px 5%;
}
#LP .lp_02 .plan_details .plan_price .inner {
background: #fff;
    border-radius: 5px;
    padding: 20px 5%;
    box-sizing: border-box;
}

#LP .lp_02 .plan_details .plan_price .title_deco_01 {
    text-align: center;
}
#LP .lp_02 .plan_details .plan_price .title_deco_01 .cp_01 {
line-height: 1.3;
    display: block;
}
#LP .lp_02 .plan_details .plan_price .title_deco_01 .cp_01 span {
}

#LP .lp_02 .plan_details .plan_price .title_deco_01 .cp_02 {
font-size: 1.7em;
line-height: 1;
}
#LP .lp_02 .plan_details .plan_price .title_deco_01 .cp_02 span {
font-size: 2em;
}

#LP .lp_02 .plan_details .plan_price ul {
text-align: center;
}
#LP .lp_02 .plan_details .plan_price ul li {
line-height: 1.2;
border-bottom: 1px solid #ccc;
padding: 10px 0;
}
#LP .lp_02 .plan_details .plan_price ul li:first-child {
border-top: 1px solid #ccc;
}
#LP .lp_02 .plan_details .plan_price ul li span {
font-size: 0.8em;
}
#LP .lp_02 .plan_details .plan_price .note {
    text-align: center;
    margin: 20px 0;
}

#LP .lp_02 .plan_details .btn_plan a:hover {
opacity: 0.8;
}

/* plan_01
========================== */
#LP .lp_02 .plan_01 .plan_price .title_deco_01 {
}
#LP .lp_02 .plan_01 .plan_price ul li {
}
#LP .lp_02 .plan_01 .plan_price {
background: url("../img/bg_line_03.gif") repeat scroll 0 0;
}
#LP .lp_02 .plan_01 .plan_price .cp_02 {
color: #fa822c;
}
#LP .lp_02 .plan_01 .plan_price .btn_plan a {
background: linear-gradient(#fb9b56, #fa822c);
}



/* plan_02
========================== */
#LP .lp_02 .plan_02 .plan_price {
background: url("../img/bg_line_02.gif") repeat scroll 0 0;
}
#LP .lp_02 .plan_02 .plan_price .cp_02 {
color: #e65078;
}
#LP .lp_02 .plan_02 .plan_price .btn_plan a {
background: linear-gradient(#eb7393, #e65078);
}

#LP .lp_02 .plan_02 .cp_02 {
transform: translateY(-43px);
}


/* ========================================

plan_set

======================================== */
#LP .lp_02 .plan_set {
padding: 70px 5% 20px;
}

#LP .lp_02 .plan_set .inner {
border-radius: 5px;
    padding: 0 5% 15px;
    box-sizing: border-box;
    text-align: center;
}

#LP .lp_02 .plan_set .title {
background: #fff;
    display: inline-block;
    transform: translateY(-18px);
    font-size: 1.3em;
    padding: 0 15px;
    position: relative;
}
#LP .lp_02 .plan_set .title:before {
content: url("../img/icon_plus.svg");
width: 30px;
    position: absolute;
    left: 50%;
    top: -39px;
    transform: translate(-50%,0);
}

#LP .lp_02 .plan_set .price_name {
    font-size: 1.2em;
    margin: -10px 0 10px 0;
    line-height: 1.3;
}
#LP .lp_02 .plan_set .price_name .d_01 {
font-size: 1.3em;
}
#LP .lp_02 .plan_set .price_name .d_02 {
font-size: 1.4em;
    margin: 0 -11px 0 -5px;
}
#LP .lp_02 .plan_set .price_name .d_03 {
font-size: 0.6em;
}


/* plan_01
========================== */
#LP .lp_02 .plan_01 .plan_set .inner {
border: 1px solid #fcb480;
}
#LP .lp_02 .plan_01 .plan_set .price_name .color {
color: #fa822c;
font-size: 1.2em;
}


/* plan_02
========================== */
#LP .lp_02 .plan_02 .plan_set .inner {
border: 1px solid #f096ae;
}
#LP .lp_02 .plan_02 .plan_set .price_name .color {
color: #e65078;
}




/* ========================================

lp_03

======================================== */
#LP .lp_03 {
background: url("../img/bg_line_01.gif") repeat scroll 0 0;
padding: 20px 5%;
}

#LP .lp_03 .title_set {
text-align: center;
margin: 0 0 40px 0;
}
#LP .lp_03 .title {
position: relative;
    font-size: 1.3em;
	display: inline-block;
	padding: 0 0 0 70px;
}
#LP .lp_03 .title span {
color: #e6501e;
font-size: 1.3em;
}
#LP .lp_03 .title:before {
content: url("../img/icon_book.svg");
width: 40px;
    position: absolute;
    left: 0;
    top: -10px;
}



/* ========================================

lp_03 タブ切り替え

======================================== */
#LP .tabs {
text-align: center;
}
#LP .lp_03 .tab_content {
background: #fff;
margin: -7px 0 0 0;
padding: 25px 5% 10px;
}

#LP .lp_03 .tab_content ul {
display: flex;
flex-wrap:wrap;
}
#LP .lp_03 .tab_content ul li {
width:49%;
margin: 0 2% 5px 0;
}
#LP .lp_03 .tab_content ul li:nth-child(2n) {
margin-right: 0;
}
#LP .lp_03 .tab_content ul li img {
width: 100%;
}

#LP .lp_03 .tab_content ul li a {
display: inline-block;
}
#LP .lp_03 .tab_content ul li a:hover {
opacity: 0.8;
}
#LP .lp_03 .tab_content ul li span {
position: relative;
    padding: 0 0 0 8px;
    font-size: 0.7em;
    line-height: 1.2;
    transform: translateY(-10px);
    display: inline-block;
}
#LP .lp_03 .tab_content ul li span:before {
content: "";
    width: 3px;
    height: 3px;
    border-bottom: 1px solid #e65078;
    border-right: 1px solid #e65078;
    transform: rotate(-45deg);
    position: absolute;
    left: 0;
    top: 4px;
    transition: all 300ms cubic-bezier(0.215,0.610,0.355,1.000);
}

#LP .tab_item {
    height: 40px;
    display: inline-block;
    width: 47%;
    position: relative;
}
#LP .tab_item span {
    display: block;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
    color: #fff;
    margin: 0 2px;
    font-size: 0.8em;
    border-radius: 5px 5px 0 0;
    vertical-align: bottom;
    transition: all 500ms cubic-bezier(0.215,0.610,0.355,1.000);
	position: absolute;
    bottom: 0;
    width: 100%;
}
#LP .tab_item span:hover {
padding: 15px 0;
}

#LP .tab_item span b {
}

#LP input[name="tab_item"] {
display: none;
}
#LP .tab_content {
	display: none;
	font-size: 15px;
	clear: both;
	overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#tab01:checked ~ #tab01_content,
#tab02:checked ~ #tab02_content {
display: block;
}

/*選択されているタブのスタイルを変える*/
#LP .tabs input:checked + .tab_item span {
	cursor:auto;
	padding: 15px 0;
}

#tab01 + .tab_item span {
background: #fa822c;
}
#tab02 + .tab_item span {
background: #e65078;
}



/* ========================================

lp_04

======================================== */
#LP .lp_04 {
padding: 20px 5%;
}

#LP .lp_04 table {
width: 100%;
font-size: 0.8em;
}
#LP .lp_04 tr:nth-child(even) th,
#LP .lp_04 tr:nth-child(even) td {
background: #F7F7F7;
}
#LP .lp_04 th,
#LP .lp_04 td {
vertical-align: top;
    text-align: left;
    border: 1px solid #ccc;
padding: 10px 5%;
	display: block;
    width: 100%;
	box-sizing: border-box;
}
#LP .lp_04 th {
white-space: nowrap;
font-weight: bold;
}
#LP .lp_04 td {
border-top: none;
border-bottom: none;
}
#LP .lp_04 tr:last-child td {
border-bottom: 1px solid #ccc;
}


/* ========================================

lp_05

======================================== */
#LP .lp_05 {
background: url("../img/img_0501.jpg") no-repeat scroll center center;
background-size: cover;
padding: 20px 5% 5px;
    margin-bottom: 50px;
}
#LP .lp_05 .inner {
}

#LP .lp_05 .text {
}
#LP .lp_05 .text p {
font-size: 1.2em;
    line-height: 1.4;
    color: #fff;
}

/* main_btn_02
========================== */
#LP .lp_05 .main_btn_02 {}

#LP .lp_05 .main_btn_02 ul {
margin: 15px 0 0 0;
}
#LP .lp_05 .main_btn_02 li {
margin: 0 0 15px 0;
}

#LP .lp_05 .main_btn_02 a {
display: block;
    text-align: center;
    background: #fff;
    border-radius: 100px;
    padding: 10px 0;
    line-height: 1.5;
    position: relative;
    font-size: 0.9em;
    width: 80%;
}
#LP .lp_05 .main_btn_02 a span {
font-size: 1.3em;
}

#LP .lp_05 .main_btn_02 li:first-child a:after,
#LP .lp_05 .main_btn_02 li:last-child a:after {
content: "";
    width: 6px;
    height: 6px;
    transform: rotate(-45deg);
    position: absolute;
    right: 15px;
    top: 27px;
    transition: all 300ms cubic-bezier(0.215,0.610,0.355,1.000);
}
#LP .lp_05 .main_btn_02 li:first-child a {
color: #fa822c;
}
#LP .lp_05 .main_btn_02 li:first-child a:after {
border-bottom: 2px solid #fa822c;
    border-right: 2px solid #fa822c;
}

#LP .lp_05 .main_btn_02 li:last-child a {
color: #e65078;
}
#LP .lp_05 .main_btn_02 li:last-child a:after {
border-bottom: 2px solid #e65078;
border-right: 2px solid #e65078;
}

#LP .lp_05 .main_btn_02 li a:hover {
opacity: 0.8;
}
#LP .lp_05 .main_btn_02 li a:hover:after {
right: 38px;
}




/* ========================================

【共通】main_btn

======================================== */
.main_btn {
    padding: 30px 0 10px 0;
}
.main_btn ul {
text-align: center;
}
.main_btn li {
width: 100%;
}
.main_btn li:first-child {
margin: 0 0 20px;
}
.main_btn a {
display: inline-block;
    padding: 6px 0;
    width: 100%;
    border-radius: 100px;
    color: #fff !important;
    position: relative;
    line-height: 1.3;
    box-shadow: 0 0 20px rgba(0,0,0,0.2);
    box-sizing: border-box;
}
.main_btn a:after {
    content: "";
    width: 8px;
    height: 8px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(-45deg);
    position: absolute;
    right: 20px;
    top: 25px;
    transition: all 300ms cubic-bezier(0.215,0.610,0.355,1.000);
}
.main_btn a:hover {
opacity: 0.8;
}
.main_btn a:hover:after {
right: 18px;
}

.main_btn a span {
font-size: 1.5em;
}
.main_btn li:first-child a {
background: linear-gradient(#fb9b56,#fa822c);
border: 5px solid #fb9b56;
}
.main_btn li:last-child a {
background: linear-gradient(#eb7393,#e65078);
border: 5px solid #eb7393;
}



/* ========================================

【共通】btn_plan

======================================== */
.btn_plan {
text-align: center;
}
.btn_plan a {
color: #fff !important;
    padding: 15px 0;
    width: 100%;
    display: inline-block;
    border-radius: 100px;
    margin: 10px 0;
    font-size: 1.3em;
    position: relative;
}
.btn_plan a:after {
content: "";
    width: 8px;
    height: 8px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(-45deg);
    position: absolute;
    right: 25px;
    top: 27px;
    transition: all 300ms cubic-bezier(0.215,0.610,0.355,1.000);
}
.btn_plan a:hover:after {
right: 23px;
}



/* ========================================

【共通】title_deco_01

======================================== */
#LP .title_deco_01 {
position: relative;
margin: 0 0 30px 0;
}
#LP .title_deco_01:before,
#LP .title_deco_01:after {
width: 50px;
top: 0;
position: absolute;
}
#LP .title_deco_01:before {
content: url("../img/text_deco_0101.svg");
    left: -10px;
}
#LP .title_deco_01:after {
content: url("../img/text_deco_0102.svg");
right: -10px;
}



/* ========================================

【共通】line

======================================== */
.line {
position: relative;
display: inline-block;
margin-bottom: 40px;
}
.line:before {
content: "";
position: absolute;
left: 50%;
bottom: -20px;
display: inline-block;
width: 50%;
height: 1px;
transform: translateX(-50%);
background-color:#333;
}




/* ========================================

common

======================================== */
#LP img {
width:100%;
}



}
/* ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■

【SP】ウィンドウ幅が768px以下の場合に適用するCSS

■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ */