@charset "utf-8";

@font-face {
    font-family: 'SOYOMapleBoldTTF';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2310@1.0/SOYOMapleBoldTTF.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'GangwonEdu_OTFBoldA';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/GangwonEdu_OTFBoldA.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.sub_visual {margin-top:190px; background:#fff9e8}
.sub_visual > div {max-width:1400px; margin:0 auto; height:250px; padding-top:70px; box-sizing:border-box}
.sub_visual > div h2 {font-size:40px; font-weight:500; margin-bottom:30px; text-align:center}
.sub_visual > div .page_navigation {text-align:center}
.sub_visual > div .page_navigation span {background:url('/images/comm/ico_home.png') no-repeat 0 0; padding-left:30px; font-size:18px}


nav.sub_menu {height:70px; margin-top:-70px; background-color:rgba(0,0,0,0.3)}
nav.sub_menu a.m1 {display:none; font-size:18px; background:rgba(0,0,0,0.3); line-height:50px; box-sizing:border-box; color:#fff; padding-left:20px; border-bottom:1px solid #fff; position:relative}
nav.sub_menu a.m1 i {width:15px; height:9px; background:url('/images/comm/allow_u.png') no-repeat; display:block; position:absolute; top:50%; transform:translateY(-50%); right:20px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease}
nav.sub_menu a.m1.on i {transform: rotate(180deg)}

nav.sub_menu ul {max-width:1300px; margin:0 auto; text-align:center; display:flex}
nav.sub_menu ul > li {display:inline-block; position:relative; flex-basis:100%; height:70px}
nav.sub_menu ul > li > a {font-size:18px; transition:all 0.3s; position:relative; display:table; width:100%; height:100%; color:#fff}
nav.sub_menu ul > li > a.long {display:flex; align-items:center; justify-content:center; line-height:1.5}
nav.sub_menu ul > li > a:after {content:''; display:inline-block; width:0; height:100%; vertical-align:middle}
nav.sub_menu ul > li.active > a:before {display:block; content:""; position:absolute; width:50px; height:5px; left:50%; top:0; background:#ffd168}
nav.sub_menu ul > li > a:hover:before {background-color:#ffd168; width:50px}
nav.sub_menu ul > li > a:before {display:block; content:""; position:absolute; width:0; height:5px; background-color:transparent; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%); -o-transform:translateX(-50%); transition:all 0.3s;}

.container {clear:both; max-width:1400px; margin:0 auto; position:relative; padding-top:70px; box-sizing:border-box}
.container.board {margin-bottom:50px}

.sub_page {line-height:1.5; font-size:17px; padding-bottom:70px; min-height:400px}
.sub_page img {max-width:100%}
.sub_page .section {margin-bottom:50px}
.sub_page .mb10 {margin-bottom:10px}
.sub_page .ml10 {margin-left:10px}

.sub_page .photo_list {display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px; text-align:center}
.sub_page .photo_list p {margin:15px 0}
.sub_page .photo_list img {border-radius:25px}

.sub_page .photo_list2 {display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:20px; text-align:center}
.sub_page .photo_list2 p {margin:15px 0}
.sub_page .photo_list2 img {border-radius:25px}

.sub_page .inquiry {padding:20px 0; box-sizing:border-box; border-top:2px solid #888; border-bottom:1px solid #dbdbdb;  font-size:1.1em}
.sub_page .inquiry i {background:#596bc0; color:#fff; padding:10px; box-sizing:border-box; border-radius:20px; margin:0 15px}
.sub_page .inquiry strong {margin-left:15px; color:#485cbb}

h2.tit {font-size:40px; text-align:center; position:relative; margin-bottom:80px; font-weight:500}
h3.tit {font-size:35px; margin-bottom:60px; font-weight:500; text-align:center; position:relative}

h4.tit {font-size:25px; margin-bottom:35px; font-weight:500; position:relative; padding-left:36px}
h4.tit:before {content:''; width:25px; height:25px; position:absolute; left:0; top:20%; background:url('/images/comm/after_img1.png')}
h5.tit {font-size:20px; margin-bottom:30px; font-weight:500; color:#357fe9}

.nav_tab1 {margin-bottom:50px; font-size:0; margin-left:-1px; display:flex}
.nav_tab1 a {font-size:18px; color:#888; width:100%; height:60px; flex-basis:100%; background:#f9f9f9; border:#ededed solid 1px; text-align:center; margin-left:1px; position:relative; line-height:1; letter-spacing:-1px}
.nav_tab1 a:hover,
.nav_tab1 a.active {border:#e7ab1b solid 1px; color:#fff; font-weight:500; background:#e7ab1b}
.nav_tab1 a:after {content:''; display:inline-block; width:0; height:100%; vertical-align:middle}
.nav_tab1 a.active:before {content: ""; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 8px solid #e7ab1b; position: absolute; left: 50%; bottom: -8px; transform: translate(-50%, 0)}

.s_tab {text-align:center; margin-bottom:50px; display:flex}
.s_tab li {text-align:center; width:100%; height:60px; flex-basis:100%; height:60px; background:#fff; border:2px solid #f4f4f4; margin-right:1px; vertical-align:top; background:#f4f4f4; box-sizing:border-box}
.s_tab li>a {display:block; color:#999; font-size:16px; height:60px}
.s_tab li>a:after {content:''; display:inline-block; width:0; height:100%; vertical-align:middle}
.s_tab li.active {background:#fff; border:2px solid #b2d56d}
.s_tab li.active a {color:#333; font-weight:700}

/*작업장을 소개해요*/
.about .greeting {display:flex}
.about .greeting .img {width:36%}
.about .greeting .img img {border-radius:50px}
.about .greeting .txt {width:64%; padding-left:40px}
.about .greeting .txt p {margin-bottom:15px}
.about .greeting .txt strong {font-size:1.1em; color:#485cbb; font-weight:500}
.about .greeting .txt .sign {text-align:right; font-size:1.3em; font-weight:500; font-family: 'GangwonEdu_OTFBoldA'}

.about2 .title {display:flex; align-items:center}
.about2 .title .img {width:40%; padding:120px 60px; box-sizing:border-box; text-align:center; border:1px solid #dbdbdb; border-radius:20px; box-shadow:3px 3px 3px #eee}
.about2 .title .txt {width:60%; padding-left:40px; box-sizing:border-box}
.about2 .title .txt li {line-heihgt:1.5; padding-left:100px; position:relative}
.about2 .title .txt li::before {content:''; width:100%; height:1px; background:#eee; position:absolute; left:0; bottom:-13px;}
.about2 .title .txt li label {position:absolute; top:-7px; left:0; width:80px; padding:7px; box-sizing:border-box; border-radius:7px; background:#485cbb; color:#fff; text-align:center; font-weight:600}
.about2 .title .txt li+li {margin-top:26px}
.about2 .title .txt li i {color:#2d4acf}

.about2 .goal {padding:30px; box-sizing:border-box; background:#f9f9f9; border-radius:0 30px 0 30px; text-align:center}

.about .mv {display:flex; margin-bottom:50px; align-items:center; text-align:center}
.about .mv .left {width:20%; font-size:1.3em; font-weight:bold}
.about .mv .left span {display:block; font-size:0.7em; font-weight:500; color:#999}
.about .mv .right {width:80%; padding-left:30px}
.about .mv .right .txt {font-size:1.2em}

.about .mv.mission .right {font-family: 'GangwonEdu_OTFBoldA'; font-size:1.3em; background:#f9f9f9; border-radius:50px; padding:28px 20px 20px 20px; box-sizing:border-box; border:1px solid #f9f9f9}
.about .mv.vision .right {padding:30px; box-sizing:border-box; border:1px solid #ddd; border-radius:25px}

.about h5.num {position:relative; padding-left:38px; margin-bottom:20px; font-size:1em; font-weight:500}
.about h5.num label {position:absolute; top:0; left:0; display:flex; justify-content:center; background:#e7715d; color:#fff; width:27px; height:27px; border-radius:5px}

.about .box {padding:30px; box-sizing:border-box; border:1px solid #ddd; border-radius:15px; background:#f9f9f9}

.about .group {text-align:center; position:relative; margin-bottom:50px}
.about .group::before {content:''; background:#dbdbdb; width:1px; height:72%; z-index:-1; position:absolute; top:0; left:50%; transform:translateX(-50%)}
.about .group .g1 {display:inline-block; padding:40px; box-sizing:border-box; border-radius:80px; margin-bottom:80px; border:1px solid #dbdbdb; box-shadow:3px 3px 3px #eee; background:#fff}
.about .group .g1 img {width:380px}
.about .group .g2 {display:flex; align-items:center; justify-content:center; width:160px; height:160px; border-radius:50%; background:#2a5bba; font-size:1.3em; color:#fff; margin:0 auto 70px; font-weight:500; position:relative}
/*.about .group .g2::before {content:''; width:170px; height:170px; border-radius:50%; background:rgba(83,162,227,0.2); z-index:-1; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%)}*/
.about .group .g3 {font-size:1.1em; display:flex; justify-content:space-around; margin-bottom:70px; position:relative}
.about .group .g3::before {content:''; width:40%; height:1px; background:#dbdbdb; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:-1}
.about .group .g3 li {width:20%; padding:12px 20px; box-sizing:border-box; background:#555; color:#fff; border-radius:30px}
.about .group .g4 {display:flex; align-items:center; justify-content:center; width:150px; height:150px; border-radius:50%; background:rgba(83,162,227)/*#ffd168*/; font-size:1.2em; color:#fff; margin:0 auto 140px; font-weight:500; position:relative}
/*.about .group .g4::before {content:''; width:160px; height:160px; border-radius:50%; background:#ffd168; opacity:0.2; z-index:-1; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%)}*/
.about .group .g5 {display:flex; justify-content:space-evenly; position:relative}
.about .group .g5::before {content:''; width:61.2%; height:1px; background:#dbdbdb; position:absolute; top:-50px; left:50%; transform:translateX(-50%)}
.about .group .g5 > div {width:22%; position:relative}
.about .group .g5 > div:nth-child(1)::before {content:''; width:1px; height:50px; background:#dbdbdb; z-index:-1; position:absolute; top:-50px; left:50%; transform:translateX(-50%)}
.about .group .g5 > div:nth-child(3)::before {content:''; width:1px; height:50px; background:#dbdbdb; z-index:-1; position:absolute; top:-50px; left:50%; transform:translateX(-50%)}
.about .group .g5 > div > div.tit {margin-bottom:20px; background:#2a5bba; color:#fff; border-radius:50px; padding:15px; box-sizing:border-box}
.about .group .g5 ul {padding:20px; box-sizing:border-box; border:2px solid rgba(42, 91, 186, 0.1); background:rgba(42, 91, 186, 0.1); border-radius:25px; position:relative}
.about .group .g5 ul::before {content:''; background:#dbdbdb; width:1px; height:20px; position:absolute; top:-21px; left:50%; transform:translateX(-50%)}
.about .group .g5 ul li {line-height:1.5}
.about .group .g5 ul li+li {margin-top:10px}

.about6 .history {display:flex; padding:50px 0; box-sizing:border-box; position:relative}
.about6 .history::before {content:''; width:2px; height:100%; background:#485cbb; position:absolute; top:0; left:20%; opacity:0.6; z-index:1}
.about6 .history::after {content:''; width:100%; height:2px; background:#f4f4f4; position:absolute; bottom:0; left:0; z-index:-1}
.about6 .history:last-child::after {display:none}
.about6 .history.alc {align-items:center}
.about6 .history .year {width:20%; font-size:4em; font-weight:bold; opacity:0.4; color:#485cbb}
.about6 .history .txt {width:80%; position:relative; padding-left:30px; box-sizing:border-box}
.about6 .history .txt li {position:relative; line-height:1.5; padding-left:100px}
.about6 .history .txt li::before {content:''; width:7px; height:7px; border-radius:25px; background:#485cbb; position:absolute; top:45%; left:-29px; transform:translateX(-50%)}
.about6 .history .txt li+li {margin-top:15px}
.about6 .history .txt li label {position:absolute; top:0; left:0; color:#485cbb; font-weight:600}

.about7 .map_txt {margin-top:20px; padding-bottom:30px; box-sizing:border-box; border-bottom:1px solid #eee}
.about7 .map_txt i {background:#485cbb; color:#fff; font-size:1.2em; padding:7px; box-sizing:border-box; border-radius:25px}
.about7 .map_txt span {font-weight:600; color:#485cbb; margin:0 20px}
.about7 .map_txt p {display:inline-block}
.about7 .fl {display:flex}
.about7 .fl > div {width:50%}
.about7 h4.sub_tit {font-size:23px; margin-bottom:30px}
.about7 h4.sub_tit i {margin-right:10px}
.about7 .la-bus {color:#35732d}
.about7 .la-car {color:#e46315}

/*서비스를 안내해요*/
.service .box {padding:30px; box-sizing:border-box; border:6px solid #eee; text-align:center; margin-bottom:50px}

.service .counseling_m {display:none}

/*우리함께 소통해요*/
.community .title {margin-bottom:50px; background:#f9f9f9; padding:40px; box-sizing:border-box; border-radius:25px}
.community .title p {font-size:1.3em; font-weight:bold; margin-bottom:20px; color:#485cbb}

.community .kind {display:flex; justify-content:space-between; margin-bottom:50px}
.community .kind li {width:calc(33.333% - 10px); text-align:center; padding:20px; box-sizing:border-box; border:1px solid #dbdbdb}
.community .kind li p {font-size:1.1em; font-weight:bold; color:#485cbb; margin:10px 0}

.community .step {display:flex; justify-content:space-between}
.community .step li {width:calc(20% - 10px); text-align:center; border:1px solid #dbdbdb; padding:20px; box-sizing:border-box; border-radius:15px; position:relative}
.community .step.three li {width:calc(32% - 10px)}
.community .step.three li::before {right:-40px}
.community .step li::before {content:''; width:30px; height:30px; background:url('/images/community/arrow.png'); position:absolute; top:50%; right:-22px; transform:translateY(-50%); z-index:1}
.community .step li:last-child::before {display:none}
.community .step li label {display:block; font-size:1.1em; font-weight:bold; color:#485cbb; margin-bottom:10px}

.community .step2 {display:flex; justify-content:space-between}
.community .step2 li {width:calc(20% - 10px); text-align:center; padding:20px; box-sizing:border-box; border-radius:15px; position:relative}
.community .step2 li:last-child::before {display:none}
.community .step2 li img {margin-bottom:15px}
.community .step2 li::before {content:''; width:30px; height:30px; background:url('/images/community/arrow.png'); position:absolute; top:50%; right:-22px; transform:translateY(-50%); z-index:1}


/*제과제빵*/
.product .box {padding:30px; box-sizing:border-box; border:6px solid #eee; margin-bottom:50px}
.product p.title {font-size:1.2em; font-weight:bold; margin-bottom:30px}
.product .ml30 {margin-left:30px}

/*회원메뉴*/
.member {font-size:16px}
.member .box {border:#e3e3e3 solid 1px; border-radius:10px; padding:20px}
.member .txt1 {margin-left:20px; margin-bottom:40px}
.member .txt1 p {margin-bottom:20px}
.member ul {margin-left:20px; margin-bottom:30px; line-height:1.5}
.member ul li {margin-bottom:10px}
.member ul li ul {margin-top:10px}
.member .next {position:relative; text-align:center; font-weight:bold; padding:20px 0; font-size:1.2em; color:#888}
.member .next::before {content:''; width:47%; height:2px; border-top: 2px dotted #eee; position:absolute; top:50%; left:0; transform:translateY(-50%); z-index:-1}
.member .next::after {content:''; width:47%; height:2px; border-top: 2px dotted #eee; position:absolute; top:50%; right:0; transform:translateY(-50%); z-index:-1}
.member_tlist {padding-top:30px}
.member .last_txt {display:flex; flex-wrap:wrap; justify-content:space-between; font-weight:bold}

.calendar {margin-bottom:50px}
.calendar > p {margin-bottom:10px; display:flex; justify-content:center; align-items:center}
.calendar > p span {font-size:30px; font-weight:700}
.calendar > p span strong {color:#009c0f}
.calendar > p span,
.calendar > p a {margin-right:20px}
.calendar > p a:last-child {margin-right:0}
.calendar > ul > li > div.Sun > time {color:#de3634;}
.calendar > ul > li > div.Sat > time {color:#477cd8;}
.calendar > ul > li > div time em {float:right; font-size:14px}
.calendar > ul > li > div time p strong {font-weight:normal; margin-top:10px; display:inline-block}

.calendar > ul {display:table; width:100%; font-size:0px; margin-bottom:15px}
.calendar > ul > li {display:table-row; width:100%}
.calendar > ul > li > div {padding:5px; display:table-cell; width:14%; min-height:140px; height:140px;border-right:1px solid #ececf1; border-bottom:1px solid #ececf1; background:#fff}
.calendar > ul > li > div:last-child {border-right:0px;}
.calendar > ul > li.cal_header > div {height:30px; line-height:30px; min-height:0px; border-top:1px solid #dfd8c6; border-right:1px solid #dfd8c6; border-bottom:1px solid #dfd8c6; background:#fbfaf7; color:#777777; font-weight:bold; text-align:center; font-size:16px}
.calendar > ul > li.cal_header > div:last-child {border-right:0px}
.calendar > ul > li.cal_header > div.Sun {color:#cc2220}
.calendar > ul > li.cal_header > div.Sat {color:#2453a5}
.calendar > ul > li > div > time {display:block; padding:3px; min-height:15px;  font-size:14px}
.calendar > ul > li > div > time span {display:none;}
.calendar > ul > li > div > time p {font-weight:normal; margin-top:5px; color:#333; text-align:center; font-size:16px; padding-bottom:10px}
.calendar > ul > li > div > time p div {background:#F00}
.calendar > ul > li > div.today{background:#f4f4f4;}


.agree {border:1px solid #999; margin-bottom:40px; padding:20px; font-size:16px}
.agree p.info {margin-bottom:20px}
.agree p.tit {font-weight:500; margin-bottom:20px}
.agree ul {margin-bottom:30px; margin-left:10px}
.agree ul li {font-size:16px}
.agree .btn {text-align:center; padding-bottom:30px; margin-left:-20px}
.agree .btn input {margin-left:20px}


.sub_page .btn_area {text-align:center; margin-left:-10px; font-size:0; margin-bottom:50px}
.sub_page .btn_area a,
.sub_page .btn_area input,
.sub_page .btn_area button {display:inline-block; margin-left:10px}



.popModal {display:none}
.popModal p.title {font-size:20px; font-weight:bold; padding-bottom:20px; margin-bottom:15px; border-bottom:2px solid #888888; width:95% !important}