@charset "utf-8";

@font-face {
  font-family: 'Pretendard';
  font-weight: 700;
  font-display: swap;
  src: local("Pretendard GOV Bold"), url("../fonts/Pretendard-Bold.woff2") format("woff2"),
       url("../fonts/Pretendard-Bold.woff") format("woff");
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 600;
  font-display: swap;
  src: local("Pretendard GOV Bold"), url("../fonts/Pretendard-SemiBold.woff2") format("woff2"),
       url("../fonts/Pretendard-SemiBold.woff") format("woff");
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 500;
  font-display: swap;
  src: local("Pretendard GOV Medium"), url("../fonts/Pretendard-Medium.woff2") format("woff2"),
       url("../fonts/Pretendard-Medium.woff") format("woff");
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 400;
  font-display: swap;
  src: local("Pretendard GOV Regular"), url("../fonts/Pretendard-Regular.woff2") format("woff2"),
       url("../fonts/Pretendard-Regular.woff") format("woff");
}
*{box-sizing:border-box;letter-spacing:-0.01em;}
html,body{font-size:10px;font-family:"Pretendard", arial, sans-serif, Tahoma, verdana;background-color:#F2F2F2;}
div,section {width:100%;}
#introWrap{display:flex;width:100%;flex-direction:column;position:relative;align-items:center;padding-top:3%;padding-bottom:4%;background-color:#F2F2F2;background-image:url("../images/bg_intro.png");background-size:cover;background-position:top center;}

/* titleWrap */
.title_wrap{}
.title_wrap h1 {width:260px;margin:0 auto;}
.title_wrap h1 img {width:100%;}
.title_wrap .title {margin-top:58px;font-size:6.4rem;font-weight:700;color:#694F31;line-height:1.3;letter-spacing:-0.01em;text-align:center;}
.title_wrap .title span {color:#222;font-weight:400;}

/* menuWrap */
.menu_wrap {display:flex;margin-top:50px;align-items:center;}
.menu_wrap .menu_list {display:flex;flex-wrap:wrap;align-items: flex-start;justify-content: center;width:1084px;margin:0 auto;}
.menu_wrap .menu_list li > a {display:flex;align-items:center;justify-content:center;flex-direction:column;width:230px;height:120px;padding:5%;font-size:2.2rem;font-weight:600;line-height:1.3;border-radius:12px;color:#2d2d2d;text-align:center;margin-bottom:28px;margin-right:28px;background-color:#fff;border:1px solid #dedede;}
.menu_wrap .menu_list li > a > em {display:flex;font-size:1.6rem;font-weight:400;line-height:1.3;justify-content:center;margin-top:8px;}
.menu_wrap .menu_list li:nth-child(4n) > a, .menu_wrap .menu_list li:last-child > a {margin-right:0;}
.menu_wrap .menu_list li:nth-child(n+4) > a {margin-bottom:0;}
.menu_wrap .menu_list li > a:hover {font-weight:700;color:#fff;background-color:#9E8567;border:1px solid #9E8567;box-shadow:8px 8px 16px 0 rgba(173,147,115,0.40);}

/* sub txt */
.sub_txt_wrap {display:flex;align-items:center;justify-content:center;margin-top:50px;}
.sub_txt_wrap .sub_txt {position:relative;padding-left:32px;font-size:2.2rem;color:#222;line-height:1.3;}
.sub_txt_wrap .sub_txt > br {display:none;}
.sub_txt_wrap .sub_txt::before {content:'';position:absolute;top:2px;left:0;width:26px;height:26px;background:url("../images/icon_warning.png") no-repeat;background-size:26px;background-position:top left;}

/* footer */
footer{display:flex;flex-direction:column;width:100%;margin-top:60px;justify-content:center;}
footer * {color:#808080;font-size:1.5rem;font-weight:400;line-height:1.5;text-align:center;}

#topWarBar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  position: relative;
  background-color: #F2F2F2;
  background-image: url(../images/bg_bar.png);
  background-size: auto 8px;
  background-repeat: repeat-x;
  background-position: top center;
}

.sub_txt_wrap_top {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 40px;
  width: 90%;
}

.sub_txt_wrap_top .sub_txt {
  position: relative;
  font-size: 3.0rem;
  color: #222;
  line-height: 1.3;
  text-align: center;
}

@media screen and (max-width:1084px){
  .title_wrap h1 {width:220px;}
  .title_wrap .title {margin-top:54px;}
  .menu_wrap {margin-top:40px;}
  .menu_wrap .menu_list {width:730px;gap:20px;}
  .menu_wrap .menu_list li > a {width:230px;height:135px;font-size:1.8rem;margin-right:unset;margin-bottom:unset;}
  .menu_wrap .menu_list li > a > em {font-size:1.4rem;}
  .sub_txt_wrap {margin-top:40px;}
  .sub_txt_wrap .sub_txt {font-size:1.6rem;padding-left:28px;}
  .sub_txt_wrap .sub_txt::before {top:-1px;width:22px;height:22px;background-size:22px;}
  footer {margin-top:110px;}
  footer * {font-size:1.4rem;}
}

@media screen and (max-width:768px){
  #introWrap {background:#F2F2F2;}
  .title_wrap .title {margin-top:40px;font-size:3.4rem;}
  .menu_wrap {margin-top:30px;}
  .menu_wrap .menu_list {width:100%;padding:0 3%;gap:12px;}
  .menu_wrap .menu_list li > a {width:200px;height:120px;font-size:1.6rem;}
  .sub_txt_wrap {margin-top:20px;}
  .sub_txt_wrap .sub_txt {padding-left:24px;font-size:1.5rem;}
  .sub_txt_wrap .sub_txt > br {display:block;}
  .sub_txt_wrap .sub_txt::before {top:0;width:20px;height:20px;background-size:20px;}
  .sub_txt_wrap_top {margin-top:20px;}
  .sub_txt_wrap_top .sub_txt {font-size:1.5rem;}
  .sub_txt_wrap_top .sub_txt > br {display:block;}
  .sub_txt_wrap_top .sub_txt::before {top:0;width:20px;height:20px;background-size:20px;}
  footer {margin-top:90px;}
}

@media screen and (max-width:445px) {
  #introWrap{padding-top:5%;padding-bottom:6%;}
  .title_wrap h1 {width:180px;}
  .title_wrap .title {margin-top:30px;font-size:2.8rem;}
  .menu_wrap {margin-top:20px;}
  .menu_wrap .menu_list {gap:10px;}
  .menu_wrap .menu_list li > a {width:170px;height:100px;font-size:1.4rem;}
  .menu_wrap .menu_list li > a > em {font-size:1.2rem;}
  .sub_txt_wrap .sub_txt {font-size:1.4rem;}  
  .sub_txt_wrap_top .sub_txt {font-size:1.8rem;}  
  footer {margin-top:10%;}
  footer * {font-size:1.2rem;}
}

@media screen and (max-width:375px) {
  .title_wrap h1 {width:163px;}
  .menu_wrap .menu_list {gap:8px;}
  .menu_wrap .menu_list li > a {width:150px;height:86px;}
  .menu_wrap .menu_list li > a > em {font-size:1.1rem;margin-top:4%;}
  .sub_txt_wrap {padding:0 5%;}
  .sub_txt_wrap .sub_txt {font-size:1.2rem;}
  .sub_txt_wrap .sub_txt::before {top:-1px;width:18px;height:18px;background-size:18px;}
  .sub_txt_wrap_top {padding:0 5%;}
  .sub_txt_wrap_top .sub_txt {font-size:1.2rem;}
  .sub_txt_wrap_top .sub_txt::before {top:-1px;width:18px;height:18px;background-size:18px;}
  footer * {font-size:1.1rem;}
}

@media screen and (max-width:360px) {
  .title_wrap h1 {width:150px;}
  .menu_wrap .menu_list li > a {width:134px;height:76px;font-size:1.2rem;}
  .menu_wrap .menu_list li > a > em {font-size:1rem;margin-top:2%;}
  .sub_txt_wrap .sub_txt {font-size:1.1rem;padding-left:20px;}
  .sub_txt_wrap .sub_txt::before {width:16px;height:16px;background-size:16px;}
  .sub_txt_wrap_top .sub_txt {font-size:1.1rem;}
  .sub_txt_wrap_top .sub_txt::before {width:16px;height:16px;background-size:16px;}
  footer {margin-top:40px;padding:0 4%;}
  footer * {font-size:1rem;}
}
@media screen and (max-width:295px) {
  .title_wrap .title {font-size:2.4rem;}
  .menu_wrap .menu_list {gap:0;padding:0 5%;}
  .menu_wrap .menu_list li:first-child {margin-top:0;}
  .menu_wrap .menu_list li {width:100%;margin-top:3%;}
  .menu_wrap .menu_list li > a {width:100%;height:70px;font-size:1.3rem;}
  .menu_wrap .menu_list li > a br {display:none;}
}