File name
Commit message
Commit date
@charset "utf-8";
/* 변수 선언 */
:root{
--img-box1: url('https://www.icqa.or.kr/images/cn/box1_1_bg.png');
--img-box2: url('https://www.icqa.or.kr/images/cn/box1_2_bg.png');
--img-box3: url('https://www.icqa.or.kr/images/cn/box1_3_bg.png');
--img-box4: url('https://www.icqa.or.kr/images/cn/box1_4_bg.png');
}
/* 변수 선언 */
/* 공통 */
* {
box-sizing: border-box;
padding: 0;
margin: 0;
}
body {
width: 100%;
height: 100%;
background-color: white;
}
ul li {
list-style: none;
}
a, a:hover, a:link, a:active{
text-decoration: none;
color: #222;
}
.wrap {
width: 100%;
max-width: 800px;
margin: 0 auto;
}
.bold {font-weight: 600;}
.left {float: left;}
.right {float: right;}
.red {color: red;}
.green {color: green;}
.blue {color: blue;}
.white {color: white;}
.black {color: black;}
.grey {color: #aaa;}
.w50 {width: 50px;}
.w100 {width: 100px;}
.w200 {width: 200px;}
.w32p {width: 32%;}
.w66p {width: 66%;}
.h50 {height: 50px;}
.h100 {height: 100px;}
.h200 {height: 200px;}
.bg_red {background-color: red;}
.bg_black {background-color: black;}
.bg_green {background-color: green;}
.bg_blue {background-color: blue;}
.big {font-size: 2em;}
.small {font-size: 0.5em;}
.m10 {margin: 10px;}
.m50 {margin: 50px;}
.m100 {margin: 100px;}
.m10 {margin-left: 10px;}
.ml2p {margin-left: 2%;}
.p10 {padding: 10px;}
.p50 {padding: 50px;}
.p100 {padding: 100px;}
.mt100 {margin-top: 100px;}
/* top */
.top {
background-color: #1b4fa0;
width: 100%;
}
.top .bg{
background-color: #143b78;
color: #fff;
padding: 10px 20px;
font-size: 0.8rem;
float: left;
}
.top .bg:hover {
color: #ccc;
}
.top .gnb {
text-align: right;
}
.top ul li {
display: inline-block;
}
.top ul li a {
display: block;
padding: 10px 15px;
font-size: 0.8rem;
color: #fff;
}
.top ul li a:hover {
color: #ccc;
}
nav {
background-color: #eee;
}
nav .logo {
float: left;
padding: 16px 0px;
width: 30%;
}
nav .lnb {
width: 70%;
display: inline-block;
}
nav .lnb li {
float: left;
width: 20%;
}
nav .lnb li a{
display: block;
padding: 27px 0;
font-weight: 600;
font-size: 1.1rem;
text-align: center;
}
nav .lnb li a:hover {
color: #005baa;
}
/* MAIN */
section {
width: 100%;
margin-top: 25px;
}
section:after {
content: '';
display: block;
clear: both;
}
/* SECTION1 */
#section1 ul li {
background-color: #333;
float: left;
min-height: 225px;
text-align: center;
width: 23%;
margin-left: 2%;
}
#section1 ul li a{
color: #fff;
display: block;
padding: 50px 0;
width: 100%;
}
#section1 ul li h3 {
font-size: 1.6rem;
font-weight: 600;
}
#section1 ul li p {
font-size: 0.8rem;
margin-top: 15px;
border: 1px solid white;
padding: 5px 15px;
display: inline-block;
}
#section1 .box {
background-position: right bottom;
background-size: contain;
background-repeat: no-repeat;
}
#section1 #box1 {
margin-left: 0;
background-color: #00a882;
background-image: var(--img-box1)
}
#section1 #box1:hover {
background-color: #00c29a;
}
#section1 #box2 {
background-color: #2263c8;
background-image: var(--img-box2)
}
#section1 #box2:hover {
background-color: #2875db;
}
#section1 #box3 {
background-color: #2083cb;
background-image: var(--img-box3)
}
#section1 #box3:hover {
background-color: #2592df;
}
#section1 #box4 {
background-color: #ff893e;
background-image: var(--img-box4)
}
#section1 #box4:hover {
background-color: #ff944c;
}
.board_box {
width: 46%;
margin-right: 4%;
display: inline-block;
font-size: 0.8rem;
}
.board_title {
font-size: 1.5rem;
border-bottom: 2px solid #005BAA;
margin-bottom: 10px;
padding-bottom: 5px;
}
.board_title a{
float: right;
color: #005BAA;
font-size: 13px;
position: relative;
top: 15px;
}
.board_content ul li {
margin-bottom: 6px;
}
.board_content ul li a {
font-weight: 600;
}
.board_content ul li span {
float: right;
}
#board_pds {
margin-right: 0;
}