#wrap {
width: 100%;
}
#header {
width: 100%;
height: 100px;
}
#header_in {
margin: 0 auto;
width: 1180px;
height: 100px;
position: relative;
}
#header_in .logo {
float: left;
width: 270px;
height: 100px;
text-align: left;
line-height: 100px;
padding-left: 20px;
box-sizing: border-box;
/* 패딩을 적용했을때 요소의 크기안에 적용 */
}
#header_in .nav {
float: left;
margin: 35px 0 0 0;
}
#header_in .nav li {
float: left;
margin-right: 40px;
}
/*li:first-child는 li태그중에 첫번째 */
#header_in .nav li:first-child {
background-color: aqua;
}
/* li:nth-child(3)는 li태그중에 3번째 */
#header_in .nav li:nth-child(3) {
background-color: blue;
}
/*li:last-child는 li태그중에 마지막번째 */
#header_in .nav li:last-child {
margin-right: 0px;
}
#header_in .nav li a {
font-size: 18px;
color: #000;
}
#header_in .infomn {
float: right;
margin-top: 24px;
}
#header_in .infomn li {
float: left;
margin-right: 12px;
padding-right: 12px;
border-right: 1px solid #333;
line-height: 12px;
}
#header_in .infomn li:last-child {
margin-right: 0px;
padding-right: 0px;
border-right: 0px;
}
#header_in .infomn a {
font-size: 12px;
}
#header_in .search_input {
position: absolute;
top: 49px;
right: 0;
width: 235px;
height: 30px;
border: 1px solid #ccc;
background-color: #fff;
}
#header_in .search_input a {
float: right;
}
#advice {
width: 100%;
height: 800px;
background-color: violet;
}
#advice_h {
margin: 0 auto;
width: 1180px;
height: 260px;
background-color: rgb(241, 196, 137);
}
#advice_h .sub_ttl {
padding-top: 60px;
text-align: center;
}
#advice_h .line {
margin: 0 auto;
margin-top: 20px;
width: 50px;
height: 5px;
background-color: red;
}
#advice_h .txt {
padding-top: 30px;
text-align: center;
font-size: 30px;
}
#advice_b {
margin: 0 auto;
width: 1180px;
height: 540px;
background-color: rgb(237, 186, 237);
}
#advice_b .sub_img {
width: 460px;
height: 500px;
border-radius: 5px;
overflow: hidden;
float: left;
}
#advice_b .group {
float: right;
width: 710px;
height: 500px;
background-color: #ccc;
}
#advice_b .list {
width: 100%;
height: 260px;
}
#advice_b .list li {
float: left;
width: 230px;
/* 230 230 230*/
height: 260px;
margin-right: 10px;
background-color: aqua;
border-radius: 3px;
text-align: center;
}
#advice_b .list li:last-child {
margin-right: 0px;
}
#advice_b .list h5 {
font-size: 28px;
color: #fff;
padding: 35px 0 15px 0;
}
#advice_b .list img {}
#advice_b .list p {
padding-top: 15px;
font-size: 14px;
color: #fff;
}
#advice_b .question {
margin-top: 10px;
width: 710px;
height: 230px;
background-color: #fff;
}
#advice_b .question_h {
width: 100%;
height: 50px;
background-color: rgb(151, 151, 151);
}
#advice_b .question_h .ttl {
float: left;
margin-left: 25px;
font-size: 16px;
color: #fff;
line-height: 50px;
}
#advice_b .question_h .info {
float: right;
font-size: 16px;
color: #fff;
line-height: 50px;
margin-right: 25px;
}
#advice_b .question_h .info>a {
font-size: 16px;
color: #fff;
}
#search {
width: 100%;
height: 750px;
background-color: aquamarine;
}
#search_h {
margin: 0 auto;
width: 1200px;
height: 260px;
background-color: rgb(241, 196, 137);
}
#search_b {
margin: 0 auto;
width: 1200px;
height: 490px;
background-color: rgb(237, 186, 237);
}
#news {
width: 100%;
height: 750px;
background-color: rgb(53, 190, 239);
}
#news_h {
margin: 0 auto;
width: 1200px;
height: 260px;
background-color: rgb(241, 196, 137);
}
#news_b {
margin: 0 auto;
width: 1200px;
height: 490px;
background-color: rgb(237, 186, 237);
}
#board {
width: 100%;
height: 750px;
background-color: rgb(236, 141, 94);
}
#board_h {
margin: 0 auto;
width: 1200px;
height: 260px;
background-color: rgb(241, 196, 137);
}
#board_b {
margin: 0 auto;
width: 1200px;
height: 490px;
background-color: rgb(237, 186, 237);
}
#footer {
width: 100%;
height: 260px;
background-color: yellowgreen;
}