@charset "utf-8";

section{animation-name: fadeInUp;}
section:nth-of-type(n+2){margin-top: 70px;}
section:last-of-type{margin-top: 0;}

/*||||| PLAN詳細 |||||*/
.type_tit{background: #D7E0EA;display: flex;padding: 15px 30px;align-items: center;margin-top: 45px;}
.type_tit::before{content: ""; border: 1px solid #fff;position: absolute;display: block;width: calc(100% - 12px);height: calc(100% - 12px);top:0;bottom:0;left: 0;right: 0;margin: auto;}
.type_tit .type{padding-right: 30px;border-right: 1px solid #333;line-height: 1;margin-right: 30px;}
.type_tit strong{font-size: 46px;vertical-align: -0.05em;}
.type_tit .breadth{font-size: 24px;line-height: 1;flex-grow: 2;}
.type_tit .breadth big{font-size: 32px;vertical-align: -0.03em;}
.type_tit .breadth small{font-size: 16px;}
.type_tit .senyuu big{font-size: 32px;vertical-align: -0.03em;}
.type_tit .senyuu span{font-size: 24px;}
.type_tit .senyuu small{font-size: 18px;}


.balcony{text-align: center;margin-top: 20px;}
.balcony big{font-size: 28px;}
.balcony span{font-size: 18px;}
.balcony + p{margin-top: 10px;text-align: center;}

.tokucho{margin: 35px 0 0 20px;}
.tokucho p{text-indent: -1em;padding-left: 1em;font-size: 18px;}
.tokucho p::before{content: "■";color: #ee827c;}
.type_img{text-align: center;margin-top: 30px;}
.type_note{text-align: center;margin-top: 30px;}

.print_btn{padding: 10px 0;background: linear-gradient(120deg,#3abacc 0%,#e29fab 25%,#e29fab 65%,#5d80ab 80%,#8b3a91 100%);color: #fff!important;font-size: 18px;display: block;margin: 45px auto 0;width: 200px;text-align: center;transition: 0.3s all;}
.print_btn::before {content: "";background: url(../img/room_plan/print_i.png);width: 20px;height: 20px;background-size: contain;margin-right: 0.5em;display: inline-block;vertical-align: -2px;}
.print_btn::after{content: "";display: block;width: calc(100% - 10px);height: calc(100% - 10px);position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;border: 1px solid #fff;}
.print_btn:hover{opacity: 0.6;}

.plan_btn_area{display: flex;max-width: 650px;flex-wrap: wrap;flex-direction: row;margin: 0 auto;}
.plan_btn:first-child,.plan_btn:nth-child(2){margin: 45px auto 0;}
.plan_btn{background: #D7E0EA;display: flex;padding: 20px 20px;align-items: center;margin: 20px auto 0;justify-content: center;width: 300px;color: #333;transition: 0.3s all;}
.plan_btn::before{content: ""; border: 1px solid #fff;position: absolute;display: block;width: calc(100% - 12px);height: calc(100% - 12px);top:0;bottom:0;left: 0;right: 0;margin: auto;}
.plan_btn .type{padding-right: 15px;border-right: 1px solid #333;line-height: 1;margin-right: 15px;text-align: center;}
.plan_btn strong{font-size: 36px;vertical-align: -0.05em;display: block;}
.plan_btn .breadth{font-size: 24px;line-height: 1;margin-right: 15px;text-align: center;}
.plan_btn .breadth big{font-size: 32px;vertical-align: -0.03em;}
.plan_btn .breadth small{font-size: 16px;display: block;}
.plan_btn .breadth .small2{font-size: 11px;display: block;}
.plan_btn .senyuu{line-height: 1.1;text-align: center;}
.plan_btn .senyuu big{font-size: 32px;vertical-align: -0.03em;}
.plan_btn .senyuu span{font-size: 20px;}
.plan_btn:hover{opacity: 0.6;}


/*||||| PLANトップ |||||*/
/* PLANトップ用タイトル */
.plan_main_item:first-child{display: flex;justify-content: space-between;margin-top:0;}
.plan_main_item{display: flex;justify-content: space-between;margin-top:30px;}
.plan_main_item .type_panel{display: block;width: 48%;text-align: center;margin-top: 0;padding: 30px 30px;animation-name: fadeInUp;}
.plan_main_item > *:nth-of-type(n+2){animation-delay: 0.2s;}
.plan_main_item .type_panel .type{padding-right: 0;border-right: none;margin-right: 0;}
.plan_main_item .type_panel .type::after{content: "";display: block;width: 30%;height: 1px;margin: 12px auto 18px;background-color: #333;}
.plan_main_item .type_panel .senyuu{margin-top: 15px;}
.plan_main_btn{padding: 10px 0;background:#fff; /* linear-gradient(120deg,#3abacc 0%,#e29fab 25%,#e29fab 65%,#5d80ab 80%,#8b3a91 100%); */color: #333!important;font-size: 18px;display: block;margin: 15px auto 0;width: 200px;text-align: center;transition: 0.3s all;}
.plan_main_btn::after{content: "";display: block;width: calc(100% - 10px);height: calc(100% - 10px);position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;border: 1px solid #B8C9D9;}
.plan_main_btn:hover{opacity: 0.6;}

.type_panel{background: #D7E0EA;display: flex;padding: 15px 30px;align-items: center;margin-top: 45px;}
.type_panel::before{content: ""; border: 1px solid #fff;position: absolute;display: block;width: calc(100% - 12px);height: calc(100% - 12px);top:0;bottom:0;left: 0;right: 0;margin: auto;}
.type_panel .type{padding-right: 30px;border-right: 1px solid #333;line-height: 1;margin-right: 30px;}
.type_panel strong{font-size: 46px;vertical-align: -0.05em;}
.type_panel .breadth{font-size: 24px;line-height: 1;flex-grow: 2;}
.type_panel .breadth big{font-size: 32px;vertical-align: -0.03em;}
.type_panel .breadth small{font-size: 16px;}
.type_panel .senyuu big{font-size: 32px;vertical-align: -0.03em;}
.type_panel .senyuu span{font-size: 24px;}
.type_panel .senyuu small{font-size: 18px;}
.type_panel .zumen{background:#fff;padding:70px;margin:20px auto;}

/* PLANトップ（ワイドスパン&キュービックプラン） */
#plan_top_contents{background: linear-gradient(120deg,#3abacc 0%,#e29fab 25%,#e29fab 65%,#5d80ab 80%,#8b3a91 100%);padding: 50px 20px;}
#plan_top_contents .plan_top_contents_wrap{background-color: #fff;padding: 50px 10px;max-width: 1024px;margin: 0 auto;animation-name: fadeIn;}
.plan_top_lead{width: 88%;margin: 0 auto;}
.plan_top_lead h4{font-size: 28px;text-align: center;border-bottom: 1px solid #333;padding-bottom: 3px;}
.plan_top_lead h4 + p{font-size: 16px;margin-top: 20px;}

.cubic_plan{display: flex;justify-content: space-between;margin-top: 30px;font-size: 16px;}
.cubic_plan dt{width: 20%;display: flex;justify-content: center;align-items: center;text-align: center;}
.cubic_plan dt::before{content: "";width: 100%;height: 2px; display: block;background: linear-gradient(to right,#55bfc3,#00a2e0);position: absolute;top: 0;left: 0;}
.cubic_plan dt::after{content: "";width: 100%;height: 2px; display: block;background: linear-gradient(to right,#55bfc3,#00a2e0);position: absolute;bottom: 0;left: 0;}
.cubic_plan dt big{font-size: 32px;}
.cubic_plan dd{width: 77%;}
.cubic_plan dd p{display: flex;justify-content: space-between;}
.cubic_plan dd p:nth-of-type(n+2){margin-top: 5px;}
.cubic_plan dd p strong{background: linear-gradient(to right,#55bfc3,#00a2e0);color: #fff;padding: 3px;width: 7em;text-align: center;line-height: 1;align-self: flex-start;letter-spacing: -0.1em;}
.cubic_plan dd p strong big{font-size: 24px;}
.cubic_plan dd p span{width: calc(100% - 7.5em);align-self: center;}
.cubic_plan_img{text-align: center;margin-top: 50px;}

/* PLAN詳細イメージ */
.type_item{display: flex;justify-content: space-between;margin:30px auto;}
.type_item li{width: 48.83%;animation-name: fadeInUp;}
.type_item li:nth-of-type(2){animation-delay: 0.2s;}
.type_item li figure{margin-top: 15px;text-align: center;}
.type_item li .note{margin-top: 7px;text-align: right;}


@media screen and (max-width: 768px) {

section:nth-of-type(n+2){margin-top: 40px;}
section:last-of-type{margin-top: 0;}

/*||||| PLAN詳細 |||||*/
.type_tit{background: #D7E0EA;display: flex;padding: 12px 15px 7px;flex-wrap: wrap;margin-top: 20px;}
.type_tit::before{width: calc(100% - 10px);height: calc(100% - 10px);}
.type_tit .type{padding-right: 10px;line-height: 1;margin-right: 10px;}
.type_tit strong{font-size: 30px;vertical-align: -0.05em;}
.type_tit .breadth{font-size: 15px;line-height: 1;flex-grow: 2;}
.type_tit .breadth big{font-size: 23px;vertical-align: -0.03em;}
.type_tit .breadth small{font-size: 15px;}
.type_tit .senyuu big{font-size: 23px;vertical-align: -0.03em;}
.type_tit .senyuu span{font-size: 16px;}
.type_tit .senyuu small{font-size: 14px;}
.balcony{margin-top: 7px;line-height: 1.3;}
.balcony big{font-size: 23px;}
.balcony span{font-size: 15px;}
.balcony + p{margin-top: 10px;text-align: left;font-size: 12px;text-indent: -1em;padding-left: 1em;}

.tokucho{margin: 25px 0 0 0;}
.tokucho p{font-size: 16px;}
.type_img{margin-top: 25px;}
.type_note{margin-top: 20px;}
.type_note img{width: 280px;}

.plan_btn{padding: 15px 0px;margin: 25px auto 0;width: 240px;}
.plan_btn::before{width: calc(100% - 10px);height: calc(100% - 10px);}
.plan_btn .type{padding-right: 10px;margin-right: 10px;}
.plan_btn strong{font-size: 28px;}
.plan_btn .breadth{font-size: 15px;margin-right: 10px;}
.plan_btn .breadth big{font-size: 25px;}
.plan_btn .breadth small{font-size: 13px;}
.plan_btn .senyuu big{font-size: 25px;}
.plan_btn .senyuu span{font-size: 16px;}



/*||||| PLANトップ |||||*/
/* PLANトップ用タイトル */
.plan_main_item{flex-wrap: wrap;}
.plan_main_item .type_panel{width: 100%;padding: 15px 15px;}
.plan_main_item > *:nth-of-type(n+2){animation-delay: 0s;margin-top: 10px;}
.plan_main_item .type_panel .type::after{margin: 8px auto 14px;}
.plan_main_item .type_panel .senyuu{margin-top: 10px;}
.plan_main_btn{padding: 8px 0;margin: 10px auto 0;width: 200px;font-size: 14px;}
.plan_main_btn::after{width: calc(100% - 8px);height: calc(100% - 8px);}

.plan_btn:nth-child(2){margin: 20px auto 0;}

.type_panel{background: #D7E0EA;display: flex;padding: 12px 15px 7px;flex-wrap: wrap;margin-top: 20px;}
.type_panel::before{width: calc(100% - 10px);height: calc(100% - 10px);}
.type_panel .type{padding-right: 10px;line-height: 1;margin-right: 10px;}
.type_panel strong{font-size: 30px;vertical-align: -0.05em;}
.type_panel .breadth{font-size: 15px;line-height: 1;flex-grow: 2;}
.type_panel .breadth big{font-size: 23px;vertical-align: -0.03em;}
.type_panel .breadth small{font-size: 15px;}
.type_panel .senyuu big{font-size: 23px;vertical-align: -0.03em;}
.type_panel .senyuu span{font-size: 16px;}
.type_panel .senyuu small{font-size: 14px;}

/* PLANトップ（ワイドスパン&キュービックプラン） */
#plan_top_contents{padding: 30px 20px;}
#plan_top_contents .plan_top_contents_wrap{padding: 30px 10px;}
.plan_top_lead{width: 94%;}
.plan_top_lead h4{font-size: 18px;padding-bottom: 3px;}
.plan_top_lead h4 + p{font-size: 14px;margin-top: 10px;}

.cubic_plan{flex-wrap: wrap; margin-top: 20px;font-size: 14px;}
.cubic_plan dt{width: 100%;}
.cubic_plan dt big{font-size: 25px;margin-left: 0.2em;}
.cubic_plan dd{width: 100%;}
.cubic_plan dd p{flex-wrap: wrap;margin-top: 10px;}
.cubic_plan dd p:nth-of-type(n+2){margin-top: 5px;}
.cubic_plan dd p strong{padding: 3px;width: 5.5em;align-self: stretch;display: flex;justify-content: center;align-items: center;}
.cubic_plan dd p strong big{font-size: 18px;}
.cubic_plan dd p span{width: calc(100% - 6.5em);font-size: 13px;}
.cubic_plan_img{margin-top: 30px;}

/* PLAN詳細イメージ */
.type_item{flex-wrap: wrap;}
.type_item li{width: 100%;}
.type_item li:nth-of-type(2){animation-delay: 0s;}
.type_item li figure{margin-top: 5px;}
.type_item li:nth-of-type(n+2){margin-top: 25px;}
.type_item li .note{margin-top: 5px;}

}



@media print {
header,#footer_before .footer_re_btn,footer,.page_tit,.contents_tit,.print_btn,.plan_btn,.type_item
{display: none;}
article{margin-top: 0;}
.type_tit{margin-top: 0;}
.balcony{margin-top: 10px;}
.tokucho {margin: 15px 0 0 20px;}
.type_img img{height: 50vh;}
.type_note{margin-top: 15px;}
#footer_before{padding-top: 20px;}
}












