/* ******************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* ******************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ .Main_Background_Fixed_Wrap { width : 100%; height : auto; margin : 0 auto; text-align : center; position : relative; margin-top : 50px; font-family : "Noto Sans Kr"; } .Main_Background_Fixed { width : 100%; height : auto; margin : 0 auto; text-align : center; padding : 75px 0 4% 0; overflow : hidden; background-image : url(../../../Image/Main_Background_Fixed.jpg); background-repeat : no-repeat; background-position : center center; background-size : cover; background-attachment: fixed; } /* .Main_Background_Fixed_Wrap .Fixed_mainLogo { width : 30%; max-width : 160px; position : absolute; left : 50%; top : 0; transform : translate(-50%, 0); } */ /* A A A : A : A : A : */ .Main_Background_Fixed img { width : 100%; height : auto; margin : 0 auto; margin-top : 20px; max-width : 830px; margin-bottom : 5px; } .Main_Background_Fixed .Wrap { display : inline-block; font-size : 0; line-height : 0; width : 100%; max-width : 1200px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript { width : 100%; height : auto; text-align : center; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Fixed_mainLogo { width : 50%; max-width : 140px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_title { font-size : 45px; font-weight : 400; line-height : 1.9em; text-align : center; color : #fff; margin-top : 3px; text-shadow : 3px 3px 3px #000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_title_yellow { font-size : 38px; font-weight : 400; text-align : center; color : #fff000; margin-top : 3px; text-shadow : 3px 3px 3px #000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .title_strong { width : 100%; height : auto; font-size : 27px; font-weight : 400; text-align : center; color : yellow; margin-top : 20px; text-shadow : 3px 3px 3px #000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_detailA { width : 100%; height : auto; font-size : clamp(12px, 1.8vw, 22px); font-weight : 400; text-align : center; display : inline-block; color : #fff; margin-top : 10px; text-shadow : 1.5px 1.5px 1.5px #000; text-shadow : 2px 2px 2px #000; line-height : 1.7em; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_detailB { width : 100%; height : auto; font-size : clamp(16px, 2.5vw, 33px); font-weight : 500; text-align : center; display : inline-block; margin-top : 13px; color : #fff000; text-shadow : 1.5px 1.5px 1.5px #000; text-shadow : 2px 2px 2px #000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .bgmorestyle { width : 23%; height : auto; display : inline-block; background : rgba(0,0,0,0); padding : 8px 0px; opacity : 1; font-size : 19px; font-weight : 400; margin-top : 40px; border : 2px solid #d0d0d0; position : relative; overflow : hidden; z-index : 3; color : #fff; transition : all ease-in-out .4s; -o-transition : all ease-in-out .4s; -ms-transition : all ease-in-out .4s; -moz-transition : all ease-in-out .4s; -webkit-transition : all ease-in-out .4s; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .bgmorestyle:hover { opacity : 1; border : 2px solid rgba(255,255,255,0.3); transition : all ease-in-out .4s; -o-transition : all ease-in-out .4s; -ms-transition : all ease-in-out .4s; -moz-transition : all ease-in-out .4s; -webkit-transition : all ease-in-out .4s; } /* Button2 */ .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore { margin-left : 2%; margin-right : 2%; color : #fff; /*background : #d0d0d0;*/ } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore:hover { background-color : #005C9B; color : #fff000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore:before { content : ''; width : 100%; height : 100%; background-color : #005C9B; position : absolute; left : -100%; top : 0; z-index : -1; transition : all ease-in-out .35s; -o-transition : all ease-in-out .35s; -ms-transition : all ease-in-out .35s; -moz-transition : all ease-in-out .35s; -webkit-transition : all ease-in-out .35s; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore:hover:before { left : 0%; transition : all ease-in-out .35s; -o-transition : all ease-in-out .35s; -ms-transition : all ease-in-out .35s; -moz-transition : all ease-in-out .35s; -webkit-transition : all ease-in-out .35s; } /* Button2 */ .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore { margin-left : 2%; margin-right : 2%; color : #fff; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore:hover { background-color : #00b68e; color : #fff000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore:before { content : ''; width : 100%; height : 100%; background-color : #00b68e; position : absolute; left : -100%; top : 0; z-index : -1; transition : all ease-in-out .35s; -o-transition : all ease-in-out .35s; -ms-transition : all ease-in-out .35s; -moz-transition : all ease-in-out .35s; -webkit-transition : all ease-in-out .35s; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore:hover:before { left : 0%; transition : all ease-in-out .35s; -o-transition : all ease-in-out .35s; -ms-transition : all ease-in-out .35s; -moz-transition : all ease-in-out .35s; -webkit-transition : all ease-in-out .35s; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore { margin-left : 2%; margin-right : 2%; color : #fff; /*background : #d0d0d0; */ } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore:hover { background-color : #e11f9e; color : #fff000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore:before { content : ''; width : 100%; height : 100%; background-color : #e11f9e; position : absolute; left : -100%; top : 0; z-index : -1; transition : all ease-in-out .35s; -o-transition : all ease-in-out .35s; -ms-transition : all ease-in-out .35s; -moz-transition : all ease-in-out .35s; -webkit-transition : all ease-in-out .35s; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore:hover:before { left : 0%; transition : all ease-in-out .35s; -o-transition : all ease-in-out .35s; -ms-transition : all ease-in-out .35s; -moz-transition : all ease-in-out .35s; -webkit-transition : all ease-in-out .35s; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .etcmore { margin-left : 2%; margin-right : 8%; color : #ffffff; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .etcmore:hover { background-color : #a835a5; color : #fff; } @media (min-width:641px) and (max-width:1024px) { /* ******************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* ******************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ .Main_Background_Fixed { padding : 30px 0px 40px; } /* .Main_Background_Fixed_Wrap .Fixed_mainLogo { max-width : 200px; margin-top : -75px; } */ .Main_Background_Fixed img { max-width : 830px; margin : 10px 0px 0 0; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript { overflow : hidden; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_title ,.Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_title_yellow { font-size : 24px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_detailA { font-size : clamp(14px, 2.2vw, 22px); } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_detailB { font-size : clamp(18px, 2.8vw, 33px); } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .bgmorestyle { width : 25%; margin-top : 25px; } } @media (max-width:640px) { /* ******************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* ******************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ .Main_Background_Fixed { padding-top : 40px; padding-bottom : 20px; } /* .Main_Background_Fixed_Wrap .Fixed_mainLogo { width : 100%; max-width : 175px; margin-top : -68px; } */ .Main_Background_Fixed_Wrap { margin-top : 15px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript { width : 95%; overflow : hidden; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript img { width : 130%; max-width : 150%; margin-left : -15%; margin-top : 20px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Fixed_mainLogo { width : 40%; margin : 0; margin-bottom : 10px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_title ,.Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_title_yellow { font-size : 25px; margin-top : 0px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .title_strong { width : 100%; height : auto; font-size : 18px; font-weight : 400; text-align : center; color : yellow; margin-top : 10px; text-shadow : 3px 3px 3px #000; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_detailA { font-size : clamp(13px, 3.3vw, 20px); margin-top : 15px; font-weight : 300; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .Main_Background_Fixed_Descript_detailB { font-size : clamp(15px, 4vw, 24px); font-weight : 400; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .bgmorestyle { width : 60%; margin-top : 0px; margin-bottom : 10px; font-size : 15px; padding-top : 9px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore { margin-left : 0%; margin-right : 0%; color : #fff000; background :#005C9B; border : 2px solid rgba(255,255,255,0.3); margin-top : 20px; } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore { margin-left : 0%; margin-right : 0%; color : #fff000; background :#005C9B; border : 2px solid rgba(255,255,255,0.3); } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore { margin-left : 0%; margin-right : 0%; color : #fff000; background :#005C9B; border : 2px solid rgba(255,255,255,0.3); } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .etcmore { margin-left : 0%; margin-right : 0%; color : #fff000; background :#005C9B; border : 2px solid rgba(255,255,255,0.3); } .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore::before, .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore::before, .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore::before, .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .etcmore::before { display : none;} .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .intromore:hover, .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .reservationmore:hover, .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .locationmore:hover, .Main_Background_Fixed .Wrap .Main_Background_Fixed_Descript .etcmore:hover { color : #fff000; background :#005C9B;} }