@charset "utf-8";

.wrapper.login .contents_wrap{height: 100vh; background-color: #91bfcb; background-image: url('../img/main_visual_img_002.png'); background-repeat: no-repeat; background-position: right center; background-size: auto 100%;}

.sub .sub_visual_wrap{background-color:#91bfcb;}
.sub .sub_visual_con{display: table; height: 404px;}
.sub .sub_visual_box{display: table-cell; float:none; vertical-align:bottom; overflow: hidden; height: 404px;}
.sub .sub_visual_text_box{padding-bottom: 103px; text-align: left; z-index: 5;}
.sub .sub_visual_text_box .sub_visual_text{overflow: hidden;}
.sub .sub_visual_text_box .sub_visual_text h2{position:relative; margin-bottom: 3px; font-size:60px; font-size:6.0rem; line-height:66px; line-height:6.6rem; letter-spacing: -0.02em; font-weight: 400; color:#fff;}
.sub .sub_visual_text_box .sub_visual_text .h_desc2{padding-left: 4px; font-size:20px; font-size:2.0rem; line-height:26px; line-height:2.6rem; letter-spacing: 0.0em; font-weight: 400; color:#fff; word-spacing: -0.09em;}
.sub .h_line2{display:none; opacity:0; position: absolute; bottom:148px; left:15px; border-bottom:2px solid #fff; width:35px; text-align: left;}
/*.sub.second .h_line2{left:calc(((100% - 1170px) / 2) + 4px); width:calc(((100% - 1170px) / 2) + 4px); bottom:149px;}*/
/*.sub.fourth .h_line2{left:calc(((100% - 1170px) / 2) + 20px); width:calc(((100% - 1170px) / 2) + 20px);}*/

.sub .sub_visual_text_box .sub_visual_text{display: none;}
.sub.first .sub_visual_text_box .sub_visual_text:nth-child(1){display:block;}
.sub.second .sub_visual_text_box .sub_visual_text:nth-child(2){display:block;}
.sub.third .sub_visual_text_box .sub_visual_text:nth-child(3){display:block;}
.sub.fourth .sub_visual_text_box .sub_visual_text:nth-child(4){display:block;}
.sub.fifth .sub_visual_text_box .sub_visual_text:nth-child(5){display:block;}


.sub .contents_wrap {overflow: hidden; padding-top: 128px; padding-bottom: 200px;}
.sub.second .contents_wrap{padding-top:77px;}
.sub.fourth .contents_wrap{padding-top:77px;}

.sub .sub_canvas_box{position: relative; bottom:-2px; float:right;}

/*  */
.sub .sub_visual_img_box{position: absolute; bottom:0; display: none;}
.sub.first .sub_visual_img_box:nth-child(1){display:block; right: 15px;}
.sub.second .sub_visual_img_box:nth-child(2){display:block; right: 0px;}
.sub.third .sub_visual_img_box:nth-child(3){display:block; right: 0px;}
.sub.fourth .sub_visual_img_box:nth-child(4){display:block; right: 0px;}
.sub.fifth .sub_visual_img_box:nth-child(5){display:block; right: 0px;}
.sub.sixth .sub_visual_img_box:nth-child(6){display:block; right: 0px;}

/*
.sub .sub_visual_img_box .alphabet{position: relative; float:right;}
.sub .sub_visual_img_box .sub_visual_obj{position: absolute; transform: translateY(100%); opacity: 0.4;}


.sub.first .sub_visual_img_box .alphabet{z-index: 3;}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_000{bottom:35px; right: 328px; z-index: 4; transform: translateY(135%);}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_001{bottom:-20px; right: 200px; z-index: 2;}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_002{bottom:-102px; right: 178px; z-index: 1;}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_003{bottom:-134px; right: 43px; z-index: 2;}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_004{bottom:-51px; right: 62px; z-index: 2;}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_005{bottom:-83px; right: 15px; z-index: 4;}
.sub.first .sub_visual_img_box .sub_visual_obj.flower_006{bottom:-93px; right: -102px; z-index: 4;}

.sub.second .sub_visual_img_box .alphabet{z-index: 3; right: 120px;}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_000{bottom:-15px; right: 415px; z-index: 4;}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_001{bottom:0px; right: 239px; z-index: 3;}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_002{bottom:68px; right: 234px; z-index: 1; transform: translateY(140%);}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_003{bottom:-84px; right: 173px; z-index: 5;}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_004{bottom:-19px; right: 153px; z-index: 2;}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_005{bottom:93px; right: 81px; z-index: 4; transform: translateY(150%);}
.sub.second .sub_visual_img_box .sub_visual_obj.flower_006{bottom:-28px; right: 47px; z-index: 1;}

.sub.fourth .sub_visual_img_box .alphabet{z-index: 1; right: 38px;}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_000{bottom:37px; right: 370px; z-index:2; transform: translateY(140%);}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_001{bottom:27px; right: 230px; z-index: 3; transform: translateY(130%);}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_002{bottom:50px; right: 250px; z-index: 3; transform: translateY(140%);}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_003{bottom:-12px; right: 186px; z-index: 5; transform: translateY(130%);}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_004{bottom:-15px; right: 180px; z-index: 4; transform: translateY(130%);}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_005{bottom:57px; right: 170px; z-index: 2; transform: translateY(130%);}
.sub.fourth .sub_visual_img_box .sub_visual_obj.flower_006{bottom:-100px; right: 155px; z-index: 3;}

.sub.fifth .sub_visual_img_box .alphabet{z-index: 1; right: 27px;}
.sub.fifth .sub_visual_img_box .sub_visual_obj.flower_000{bottom:-12px; right: 184px; z-index:2;}
.sub.fifth .sub_visual_img_box .sub_visual_obj.flower_001{bottom:-100px; right: 156px; z-index: 3;}
*/

@media all and (min-width: 992px) {
    .sub .h_line2{display:block; left:15px; width:20px;}
    .sub.second .h_line2{left:15px; width:20px;}
    .sub.fourth .h_line2{left:15px; width:35px;}
}

@media all and (min-width: 1200px) {
    .sub .h_line2{left:calc(((100% - 1170px) / 2) + 3px); width:calc(((100% - 1170px) / 2) + 3px);}
    .sub.second .h_line2{left:calc(((100% - 1170px) / 2) + 4px); width:calc(((100% - 1170px) / 2) + 4px);}
    .sub.fourth .h_line2{left:calc(((100% - 1170px) / 2) + 20px); width:calc(((100% - 1170px) / 2) + 20px);}
}