485 lines
13 KiB
SCSS
485 lines
13 KiB
SCSS
$point-color : #1e3571;
|
|
$point-color2 : #ffc700;
|
|
|
|
#topic_bg {
|
|
//padding-top: 70px;//메뉴만큼 띄우기
|
|
width: 100%;
|
|
//background-color: green;
|
|
|
|
|
|
|
|
>.topic_bg_info {
|
|
width: 100%;
|
|
height: 300px;
|
|
background-image: url(../images/ceo.jpg);
|
|
background-position: 50% 40%;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
|
|
>ul {
|
|
opacity: 0;
|
|
margin: 0 auto;
|
|
padding-top: 160px;
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
|
|
//background-color: green;
|
|
|
|
>li {
|
|
color: #fff;
|
|
|
|
&:first-child {
|
|
font-size: 35px;
|
|
font-weight: 700;
|
|
padding-bottom: 7px;
|
|
|
|
>span {
|
|
margin-left: 3px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
color: $point-color2;
|
|
}
|
|
}//end of li:first
|
|
|
|
&:last-child {
|
|
font-size: 13px;
|
|
}//end of li:last
|
|
}
|
|
}//end of ul
|
|
}//end of topic_bg_info
|
|
|
|
}//end of topic_bg
|
|
|
|
|
|
@media screen and(max-width : 768px) {/*topic bg 768px 반응형*/
|
|
|
|
#topic_bg {
|
|
//padding-top: 70px;//메뉴만큼 띄우기
|
|
width: 100%;
|
|
//background-color: green;
|
|
|
|
|
|
|
|
>.topic_bg_info {
|
|
width: 100%;
|
|
height: 300px;
|
|
background-image: url(../images/ceo.jpg);
|
|
background-position: 50% 40%;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
|
|
>ul {
|
|
opacity: 0;
|
|
margin: 0 auto;
|
|
padding-top: 160px;
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
|
|
//background-color: green;
|
|
|
|
>li {
|
|
color: #fff;
|
|
|
|
&:first-child {
|
|
font-size: 35px;
|
|
font-weight: 700;
|
|
padding-bottom: 7px;
|
|
|
|
>span {
|
|
margin-left: 3px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
color: $point-color2;
|
|
}
|
|
}//end of li:first
|
|
|
|
&:last-child {
|
|
font-size: 13px;
|
|
}//end of li:last
|
|
}
|
|
}//end of ul
|
|
}//end of topic_bg_info
|
|
|
|
}//end of topic_bg
|
|
|
|
}//topic bg 768px 반응형
|
|
|
|
|
|
|
|
.topic2_bg {
|
|
width: 100%;
|
|
height: 300px;
|
|
background-image: url(../images/topic05_bg.jpg);
|
|
background-position: 50% 20%;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
|
|
>ul {
|
|
opacity: 0;
|
|
margin: 0 auto;
|
|
padding-top: 160px;
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
|
|
//background-color: green;
|
|
|
|
>li {
|
|
color: #fff;
|
|
|
|
&:first-child {
|
|
font-size: 35px;
|
|
font-weight: 700;
|
|
padding-bottom: 7px;
|
|
|
|
>span {
|
|
margin-left: 3px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
color: $point-color2;
|
|
}
|
|
}//end of li:first
|
|
|
|
&:last-child {
|
|
font-size: 13px;
|
|
}//end of li:last
|
|
}
|
|
}//end of ul
|
|
}//end of topic2sub_bg
|
|
|
|
@media screen and(max-width : 768px) { /*topic2 subbg 768px 반응형*/
|
|
|
|
.topic2_bg {
|
|
width: 100%;
|
|
height: 300px;
|
|
background-image: url(../images/topic05_bg.jpg);
|
|
background-position: 50% 20%;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
|
|
>ul {
|
|
opacity: 0;
|
|
margin: 0 auto;
|
|
padding-top: 160px;
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
|
|
//background-color: green;
|
|
|
|
>li {
|
|
color: #fff;
|
|
|
|
&:first-child {
|
|
font-size: 35px;
|
|
font-weight: 700;
|
|
padding-bottom: 7px;
|
|
|
|
>span {
|
|
margin-left: 3px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
color: $point-color2;
|
|
}
|
|
}//end of li:first
|
|
|
|
&:last-child {
|
|
font-size: 13px;
|
|
}//end of li:last
|
|
}
|
|
}//end of ul
|
|
}//end of topic2sub_bg
|
|
|
|
}//topic2 subbg 768px 반응형
|
|
|
|
.topic3_bg {
|
|
width: 100%;
|
|
height: 300px;
|
|
background-image: url(../images/question2.jpg);
|
|
background-position: 50% 15%;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
|
|
>ul {
|
|
opacity: 0;
|
|
margin: 0 auto;
|
|
padding-top: 160px;
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
|
|
//background-color: green;
|
|
|
|
>li {
|
|
color: #fff;
|
|
|
|
&:first-child {
|
|
font-size: 35px;
|
|
font-weight: 700;
|
|
padding-bottom: 7px;
|
|
|
|
>span {
|
|
margin-left: 3px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
color: $point-color2;
|
|
}
|
|
}//end of li:first
|
|
|
|
&:last-child {
|
|
font-size: 13px;
|
|
}//end of li:last
|
|
}
|
|
}//end of ul
|
|
}//end of topic3_bg
|
|
|
|
#ceo {
|
|
width: 100%;
|
|
margin-bottom: 60px;
|
|
height: 700px;
|
|
background-color: #fff;
|
|
//background-color: green;
|
|
|
|
>.index_tap {
|
|
width: 100%;
|
|
height: 35px;
|
|
border-bottom : 1px solid #eee;
|
|
background-color: #ffffff;
|
|
|
|
>p {
|
|
margin: 0 auto;
|
|
width: 1000px;
|
|
font-size: 13px;
|
|
line-height: 35px;
|
|
text-align: right;
|
|
color: #333;
|
|
|
|
>em {
|
|
padding: 0 3px;
|
|
font-weight: 900;
|
|
color: $point-color2;
|
|
|
|
}
|
|
>span {
|
|
|
|
>a {
|
|
color: #222;
|
|
font-weight: 900;
|
|
|
|
&:hover {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
}//end of p
|
|
}//end of index_tap
|
|
|
|
|
|
|
|
|
|
|
|
>.ceo_info {
|
|
position: relative;
|
|
width: 1000px;
|
|
margin: 0 auto;
|
|
|
|
>ul {
|
|
margin-top: 80px;
|
|
width: 100%;
|
|
//background-color: green;
|
|
>li {
|
|
margin-top: 20px;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
color: #333;
|
|
line-height: 1.7em;
|
|
text-align: justify;
|
|
|
|
&.ceo_info_main {
|
|
position: relative;
|
|
font-size: 30px;
|
|
font-weight: 700;
|
|
color: $point-color;
|
|
margin-bottom: 55px;
|
|
line-height: 1.3em;
|
|
|
|
&:after {
|
|
position: absolute;
|
|
top: 65px;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 1px;
|
|
background-color: #ddd;
|
|
content: '';
|
|
}
|
|
}//end of ceo_info_main
|
|
}
|
|
}//end of ul
|
|
|
|
&:after {
|
|
position: absolute;
|
|
top: 100px;
|
|
right: 0;
|
|
width: 300px;
|
|
height: 445px;
|
|
background-image: url(../images/ceo_bg.png);
|
|
background-repeat: no-repeat;
|
|
background-position: 50% 50%;
|
|
background-size: cover;
|
|
content: '';
|
|
}
|
|
}//end of ceo_info
|
|
|
|
.all_employees {
|
|
position: absolute;
|
|
bottom: -40px;
|
|
left: 50%;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
}//end of all_employees
|
|
.all_employees_eng {
|
|
display: none;
|
|
position: absolute;
|
|
bottom: -20px;
|
|
left: 50%;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
}//end of all_employees
|
|
|
|
}//end of CEO
|
|
|
|
|
|
@media screen and(max-width : 768px) {/*CEO 768px 반응형*/
|
|
|
|
#ceo {
|
|
width: 100%;
|
|
padding-bottom: 100px;
|
|
margin-bottom: 0px;
|
|
height: auto;
|
|
background-color: #fff;
|
|
//background-color: green;
|
|
|
|
>.index_tap {
|
|
width: 100%;//변경
|
|
height: 35px;
|
|
border-bottom : 1px solid #eee;
|
|
background-color: #ffffff;
|
|
|
|
>p {
|
|
margin: 0 auto;
|
|
width: 100%;
|
|
font-size: 13px;
|
|
line-height: 35px;
|
|
padding-left: 0px;
|
|
text-align: center;//변경
|
|
color: #333;
|
|
|
|
>em {
|
|
padding: 0 3px;
|
|
font-weight: 900;
|
|
color: $point-color2;
|
|
|
|
}
|
|
>span {
|
|
|
|
>a {padding-right: 240px;
|
|
color: #222;
|
|
font-weight: 900;
|
|
|
|
&:hover {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
}//end of p
|
|
}//end of index_tap
|
|
|
|
|
|
|
|
|
|
|
|
>.ceo_info {
|
|
position: relative;
|
|
width: 90%;//변경
|
|
margin: 0 auto;
|
|
|
|
>ul {
|
|
margin-top: 80px;
|
|
width: 100%;
|
|
//background-color: green;
|
|
>li {
|
|
margin-top: 20px;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
color: #333;
|
|
line-height: 1.7em;
|
|
text-align: left;
|
|
|
|
>br {
|
|
display: none;
|
|
}
|
|
|
|
&.ceo_info_main {
|
|
text-align: center;
|
|
position: relative;
|
|
font-size: 22px;
|
|
font-weight: 700;
|
|
color: $point-color;
|
|
margin-bottom: 55px;
|
|
line-height: 1.3em;
|
|
|
|
>span {
|
|
display: block;
|
|
}
|
|
|
|
&:after {
|
|
position: absolute;
|
|
top: 65px;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 1px;
|
|
background-color: #ddd;
|
|
content: '';
|
|
}
|
|
}//end of ceo_info_main
|
|
}
|
|
}//end of ul
|
|
|
|
&:after {
|
|
display: none;//변경
|
|
position: absolute;
|
|
top: 100px;
|
|
right: 0;
|
|
width: 300px;
|
|
height: 445px;
|
|
background-image: url(../images/ceo_bg.png);
|
|
background-repeat: no-repeat;
|
|
background-position: 50% 50%;
|
|
background-size: cover;
|
|
content: '';
|
|
}
|
|
}//end of ceo_info
|
|
|
|
.all_employees {
|
|
position: absolute;
|
|
bottom: -40px;
|
|
left: 50%;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
}//end of all_employees
|
|
.all_employees_eng {
|
|
display: none;
|
|
position: absolute;
|
|
bottom: -20px;
|
|
left: 50%;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
}//end of all_employees
|
|
|
|
}//end of CEO
|
|
|
|
|
|
}//CEO 768px 반응형
|