@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;500;600;700;900&display=swap');
@import url(contents.css);
@import url(board.css);
@font-face {
    font-family: 'MAaruBuri';
    src: url('font/MaruBuri-ExtraLight.woff2') format('woff2'),
        url('font/MaruBuri-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MaruBuri';
    src: url('font/MaruBuri-Light.woff2') format('woff2'),
        url('font/MaruBuri-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MaruBuri';
    src: url('font/MaruBuri-Regular.woff2') format('woff2'),
        url('font/MaruBuri-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MaruBuri';
    src: url('font/MaruBuri-SemiBold.woff2') format('woff2'),
        url('font/MaruBuri-SemiBold.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'MaruBuri';
    src: url('font/MaruBuri-Bold.woff2') format('woff2'),
        url('font/MaruBuri-Bold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* ==============================================
   defaults
   ============================================== */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; vertical-align:baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block;}
ol, ul { list-style:none;}
blockquote, q {	quotes:none;}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none;}
table { border-collapse:collapse; border-spacing:0;}
::-moz-selection { background: #b3d4fc; text-shadow: none; }
::selection { background: #b3d4fc; text-shadow: none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
img { vertical-align: middle; }
input, select { margin:0; padding:0; vertical-align:middle;}
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }.chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }

.ir { background-color: transparent; border: 0; overflow: hidden; text-indent:-9999px;}
.ir:before { content: ""; display: block; width: 0; height: 150%; }

.clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ }
.clearfix:after { clear: both; }
.clearfix {  *zoom: 1;}
.hidden { display:none;}

/* box sizing */

html {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
*, *:before, *:after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}

/* ==============================================
   layout
   ============================================== */

html { overflow:auto; overflow-y:scroll;}
input,
select,
button,
textarea,
body { color:#2f2f2f; font-size:16px; font-family:'Pretendard', 'Nanum Gothic', 'dotum', '돋움', 'gulim', '굴림', arial !important;}

#wrap { min-width: 1300px; }
#wrapIn { padding-top: 200px; }

.forPC { display: block !important;}
.forMobile { display: none !important;}
.mobileMenu { display: none;}

/* header */

#header { position: absolute; left: 0; top: 0; width: 100%; min-width: 1300px; background-color: #fff; z-index: 99; }
#header h1 { width: 265px; padding: 40px 0; margin: 0 auto; }
#header h1 a { display: block; height: 58px; text-indent: -9999px; background: url(../images/common/logo.png) center center no-repeat; }

#header .topSlogan { position: absolute; left: 60px; top: 76px; }
#header .topSlogan p { font-family: 'Montserrat'; line-height: 17px; font-size: 13px; }
#header .topSlogan p span { display: block; line-height: 22px; font-size: 18px; font-weight: 700; }
#header .topSlogan p span strong { color: #42d3fa; font-weight: 600; }

#header .topMenu { position: absolute; right: 130px; top: 87px; }
#header .topMenu ul { display: flex; gap: 0 20px; }
#header .topMenu ul li { font-family: 'Montserrat'; line-height: 23px; font-size: 14px; text-transform: uppercase; }
#header .topMenu ul li a { color: #000; font-weight: 500; text-decoration: none; }
#header .topMenu ul li a:hover { text-decoration: underline; }

/* menu toggle */

.menu-toggle {
	position: absolute; right: 60px; top: 87px;
	width: 30px;
	height: 23px;
	cursor: pointer;
	z-index: 200;
}
.menu-toggle span {
	display: block;
	position: absolute;
	width: 100%;
	height: 3px;
	background: #000;
	left: 0;
	top: 10px;
	transition: all 0.3s ease;
}
.menu-toggle:before { content: " "; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: #000; transition: all 0.3s ease; }
.menu-toggle:after { content: " "; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 3px; background: #000; transition: all 0.3s ease; }

/* X 아이콘으로 변환 */
.menu-toggle.active:before {
	transform: rotate(45deg);
	top: 10px;
}
.menu-toggle.active span {
	opacity: 0;
}
.menu-toggle.active:after {
	transform: rotate(-45deg);
	bottom: 10px;
}

/* gnb */

#header .gnb { position: relative; display: flex; justify-content: center; border-top: 1px solid #e1e1e1; border-bottom: 3px solid #70cbe3; overflow: hidden; }
#header .gnb > ul.list { display: flex; justify-content: center; height: 58px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
#header .gnb > ul.list:hover { height: 382px; }
#header .gnb > ul.list > li > a { display: block; height: 58px; line-height: 58px; color: #000; font-size: 18px; font-weight: 500; text-decoration: none; padding: 0 37px; }
#header .gnb > ul.list > li > a:hover { color: #24a7ca; }
#header .gnb > ul.list > li.active > a { color: #24a7ca; }

.sub-menu { position: absolute; left: 0; top: 58px; display: none; justify-content: center; width: 100%; height: 324px; border-top: 1px solid #e1e1e1; }
#header .gnb > ul.list > li:hover > .sub-menu { display: flex; }
.sub-menu .head { width: 184px; height: 100%; padding-top: 46px; }
.sub-menu .head p.title { font-family: 'MaruBuri'; line-height: 40px; font-size: 28px; font-weight: 400; }
.sub-menu .head p.exp { line-height: 20px; font-size: 15px; color: #9b9b9b; font-weight: 300; margin-top: 15px; }

.sub-menu > ul { width: calc((1300px - 184px) / 2); border-left: 1px solid #e1e1e1; padding: 45px 30px 0; }
.sub-menu > ul.menuLeft {}
.sub-menu > ul.menuRight {}
.sub-menu > ul > li { margin-bottom: 22px; }
.sub-menu > ul > li:last-child { margin-bottom: 0; }
.sub-menu > ul > li > a { line-height: 30px; font-size: 18px; color: #000; font-weight: 500; text-decoration: none; }
.sub-menu > ul > li > a:hover { color: #24a7ca; }
.sub-menu > ul > li > ul { display: flex; justify-content: flex-start; gap: 0 25px }
.sub-menu > ul > li > ul > li { position: relative; padding-left: 13px; }
.sub-menu > ul > li > ul > li:after { content: " "; position: absolute; left: 0; top: 10px; width: 4px; height: 4px; background-color: #4cd3f7; }
.sub-menu > ul > li > ul > li a { line-height: 26px; font-size: 16px; color: #000; font-weight: 300; text-decoration: none; }
.sub-menu > ul > li > ul > li a:hover { color: #24a7ca; }


/* global menu */

.global-menu { display: none; position: absolute; left: 0; top: 197px; width: 100%; border-top: 1px solid #e1e1e1; border-bottom: 3px solid #70cbe3; background-color: #fff; z-index: 300; }
.global-menu .sub-menu { position: relative; left: auto; top: auto; display: flex; width: 1300px; height: auto; border-top: 0; background: url('../images/common/line_dashed_gray.png') left bottom repeat-x; margin: 0 auto; }
.global-menu .sub-menu:last-child { background: none; }
.global-menu .sub-menu .head { padding: 46px 0; }
.global-menu .sub-menu > ul { border: 0; padding: 45px 30px; }

/* footer */

#footer {}

.footPartners { border-top: 1px solid #e1e1e1; }
.footPartners .partners { position: relative; width: 1300px; padding: 0 60px; margin: 0 auto; }
.footPartners .partners ul li .con { display: flex; justify-content: center; align-items: center; width: 100%; height: 125px; gap: 0 40px; }
.footPartners .partners .flex-direction-nav {}
.footPartners .partners .flex-direction-nav a { display: block; position: absolute; top: 50%; width: 42px; height: 42px; text-indent: -9999px; background-color: #f1f1f1; background-repeat: no-repeat; background-position: center center; margin-top: -21px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.footPartners .partners .flex-direction-nav a:hover { background-color: #dadada; }
.footPartners .partners .flex-direction-nav a.flex-prev { left: 0; background-image: url('../images/common/icon_brace_left_gray.png'); }
.footPartners .partners .flex-direction-nav a.flex-next { right: 0; background-image: url('../images/common/icon_brace_right_gray.png'); }

.footMenu { position: relative; height: 70px; background-color: #f1f1f1; }
.footMenu ul.menu { display: flex; justify-content: flex-start; align-items: center; width: 1300px; height: 100%; margin: 0 auto; }
.footMenu ul.menu li { position: relative; padding-left: 26px; margin-left: 25px; }
.footMenu ul.menu li:after { content: " "; position: absolute; left: 0; top: 50%; width: 1px; height: 15px; background: #b6b6b6; margin-top: -8px; }
.footMenu ul.menu li:first-child { padding-left: 0; margin-left: 0; }
.footMenu ul.menu li:first-child:after { display: none; }
.footMenu ul.menu li a { line-height: 26px; font-size: 16px; color: #000; font-weight: 400; text-decoration: none; }
.footMenu ul.menu li a:hover {}

.footMenu ul.sns  { position: absolute; right: 50%; top: 50%; display: flex; gap: 10px; margin-right: -650px; margin-top: -16px; }
.footMenu ul.sns li  {}

.footerIn { position: relative; width: 1300px; padding: 46px 0 46px 390px; margin: 0 auto; }
.footerIn h1 { position: absolute; left: 0; top: 90px; width: 265px; height: 54px; text-indent: -9999px; background: url('../images/common/logo.png') center center no-repeat; }
.footerIn ul.info {}
.footerIn ul.info li { line-height: 26px; font-size: 16px; }
.footerIn p { line-height: 26px; font-size: 16px; margin-top: 26px; }


/* quick */

#quickWrap { position: absolute; right: 30px; top: 710px; z-index: 200; }
body.main #quickWrap { top: 430px; }
#quickWrap ul {}
#quickWrap ul li { margin-bottom: 6px; }
#quickWrap ul li a { display: block; position: relative; width: 64px; height: 64px; color: #000; text-decoration: none; background: rgba(255,255,255,.3); margin-left: auto; overflow: hidden;
	-moz-border-radius: 32px;
	-webkit-border-radius: 32px;
	border-radius: 32px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
#quickWrap ul li a:hover { width: 230px; background: #fff; 
	-moz-box-shadow: 0px 5px 16px rgba(0,0,0,.18);
	-webkit-box-shadow: 0px 5px 16px rgba(0,0,0,.18);
	box-shadow: 0px 5px 16px rgba(0,0,0,.18);
}
#quickWrap ul li p.icon { position: absolute; left: 0; top: 0; width: 64px; height: 64px; line-height: 64px; text-align: center; }
#quickWrap ul li p.icon:before { content: ""; display: inline-block; height: 100%; vertical-align: middle;}
#quickWrap ul li p.icon img { vertical-align:middle;}
#quickWrap ul li p.title { display: block; width: 230px; line-height: 64px; font-size: 15px; word-break: keep-all; word-wrap: normal; background: url('../images/common/icon_brace_right_blue.png') right 20px center no-repeat; padding: 0 0 0 64px; overflow: hidden; opacity: 0;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;

}
#quickWrap ul li a:hover p.title { opacity: 1; }



/* mediaquery for tab */

@media only screen and (min-width: 801px) and (max-width: 1200px) {

}

/* mediaquery for mobile */

@media only screen and (max-width: 800px) {

	.forPC { display: none !important;}
	.forMobile { display: block !important;}

	.mobileMenu { display: block; width: auto; height: 40px; line-height: 40px; font-size: 15px; text-align: center; color: #fff; background-color: #015a8e; margin: 0 10px;}
	.mobileMenu { display: block; position: absolute; right: 20px; top: 28px; width: 33px; height: 23px; text-indent: -9999px; background: #11bdd2 url(../images/mobile/top_btn_menu.png) 0 0 no-repeat; -webkit-background-size: 33px auto; background-size: 33px auto;}

}

/* ==============================================
   main
   ============================================== */

/* visual */

.visWrap { position: relative; height: 800px;}
.visWrap .banner { position: absolute; right: 30px; top: 30px; z-index: 99; 
	-moz-border-radius: 36px;
	-webkit-border-radius: 36px;
	border-radius: 36px;
	-moz-box-shadow: 0px 5px 16px rgba(0,0,0,.18);
	-webkit-box-shadow: 0px 5px 16px rgba(0,0,0,.18);
	box-shadow: 0px 5px 16px rgba(0,0,0,.18);
}

#mainVisual ul.slides,
#mainVisual .flex-viewport { height: 100%; }
#mainVisual { width: 100%; height: 100%; border: 0; padding: 0; margin: 0; overflow: hidden; }
#mainVisual ul.slides { padding: 0; margin: 0; }
#mainVisual ul.slides li { position: relative; width: 100%; height: 100%; 
	display: none; 
	-webkit-backface-visibility: hidden;
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#mainVisual ul.slides li .con { position: absolute; left: 50%; top: 120px; width: 100%; font-family: 'MaruBuri'; font-weight: 400; padding-top: 60px; margin-left: -545px; height: 465px; }
#mainVisual ul.slides li .con p.since { line-height: 60px; font-size: 46px; font-weight: 600; letter-spacing: -0.03em; margin-top: -60px; margin-bottom: 40px; }
#mainVisual ul.slides li .con p.since span { font-size: 52px; font-weight: 300; }
#mainVisual ul.slides li .con p.slogan { line-height: 60px; font-size: 48px; font-weight: 400; letter-spacing: -0.05em; }
#mainVisual ul.slides li .con p.slogan span { color: #fff; }
#mainVisual ul.slides li .con p.exp { line-height: 36px; font-size: 22px; margin-top: 26px; letter-spacing: -0.05em; }
#mainVisual ul.slides li .con a { display: block; position: absolute; left: 0; bottom: 0; width: 214px; font-family: 'Pretendard'; line-height: 24px; font-size: 18px; color: #000; text-decoration: none; font-weight: 500; text-decoration: none; border: 1px solid #000; background: url('../images/common/icon_arrow_right_blue.png') right 24px center no-repeat; padding: 15px 26px; 
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
#mainVisual ul.slides li .con a:hover { background-position: right 36px center; }

#mainVisual ul.slides li .con .roll { position: relative; height: 120px; overflow: hidden; }
#mainVisual ul.slides li .con .roll p.slogan { position: absolute; left: 0; top: 0; width: 100%;
	  opacity: 0;
	  transform: translateY(100%); /* 처음엔 아래쪽 */
	  animation-duration: 7s;
	  animation-iteration-count: infinite;
	  animation-timing-function: ease-in-out;
}
/*#mainVisual ul.slides li .con .roll p.s1 { opacity: 1; transform: translateY(0); }
#mainVisual ul.slides li .con .roll p.s2 { opacity: 0; transform: translateY(100%); }
#mainVisual ul.slides li.flex-active-slide .con .roll p.s1 { transition-delay: 8s; opacity: 1; transform: translateY(-100%); }
#mainVisual ul.slides li.flex-active-slide .con .roll p.s2 { transition-delay: 8s; opacity: 1; transform: translateY(0); }*/

#mainVisual ul.slides li .con .roll p.s1 {
  animation-name: slide1;
}

/* 두 번째 문구 */
#mainVisual ul.slides li .con .roll p.s2 {
  animation-name: slide2;
}

@keyframes slide1 {
  0%   { opacity: 1; transform: translateY(0); }
  40%   { opacity: 1; transform: translateY(0); }
  45%  { opacity: 0; transform: translateY(-100%); }
  95%  { opacity: 0; transform: translateY(-100%); }
  100%  { opacity: 1; transform: translateY(0); }
}

@keyframes slide2 {
  0%   { opacity: 0; transform: translateY(100%); }
  40% { opacity: 0; transform: translateY(100%); }
  45%  { opacity: 1; transform: translateY(0); }
  95%  { opacity: 1; transform: translateY(0); }
  100%  { opacity: 0; transform: translateY(100%); }
}

#mainVisual ol.flex-control-nav { position: absolute; left: 0; bottom: 76px; display: flex; justify-content: center; width: 100%; gap: 0 5px; z-index: 9; }
#mainVisual ol.flex-control-nav li { width: 75px; }
#mainVisual ol.flex-control-nav li a { display: block; height: 20px; text-indent: -9999px; background: transparent; border-bottom: 1px solid #000; cursor: pointer; }
#mainVisual ol.flex-control-nav li a.flex-active { border-bottom: 3px solid #42d3fa; margin-top: 1px; }

#mainVisual ul.flex-direction-nav li a { position: absolute; top: 50%; width: 28px; height: 58px; text-indent: -9999px; margin-top: -29px; z-index: 9; }
#mainVisual ul.flex-direction-nav li a.flex-prev { left: 70px; background: url(../images/main/visual_nav_prev.png) center center no-repeat; }
#mainVisual ul.flex-direction-nav li a.flex-next { right: 70px; background: url(../images/main/visual_nav_next.png) center center no-repeat; }

/* quick */

.mainQuick { display: flex; justify-content: center; align-items: center; border-bottom: 1px solid #e0e0e0; }
.mainQuick p.head { width: 220px; height: 125px; line-height: 125px; font-family: 'Montserrat'; font-size: 18px; border-right: 1px solid #e0e0e0; }
.mainQuick p.head strong { font-weight: 700; }
.mainQuick ul { display: flex; justify-content: center; }
.mainQuick ul li { width: calc((1300px - 220px) / 4); height: 125px; border-right: 1px solid #e0e0e0; }
.mainQuick ul li a { display: flex; justify-content: flex-start; align-items: center; height: 100%; text-decoration: none; color: #000; }
.mainQuick ul li a p.icon { width: 126px; text-align: center; }
.mainQuick ul li:first-child a p.icon { width: 106px; }
.mainQuick ul li a p.title {}
.mainQuick ul li a p.title span.main { display: block; line-height: 30px; font-size: 18px; font-weight: 600; }
.mainQuick ul li a p.title span.sub { line-height: 24px; font-size: 14px; color: #aeaeae; }

/* slogan */

.mainSlogan { font-family: 'MaruBuri'; text-align: center; letter-spacing: -0.05em; padding: 75px 0 68px; }
.mainSlogan p.main { line-height: 60px; font-size: 42px; font-weight: 400; }
.mainSlogan p.sub { line-height: 32px; font-size: 20px; margin-top: 8px; }

/* treatment */

.mainTreatment {}
.mainTreatment ul { display: flex; flex-wrap: wrap; gap: 50px 28px; width: 1300px; margin: 0 auto; }
.mainTreatment ul li { width: 304px; background-color: #f1f1f1; }
.mainTreatment ul li a { display: block; text-decoration: none; color: #000; }
.mainTreatment ul li a p.title { height: 116px; text-align: center; padding-top: 28px; }
.mainTreatment ul li a p.title span.main { display: block; font-family: 'MaruBuri'; line-height: 40px; font-size: 28px; letter-spacing: -0.05em; }
.mainTreatment ul li a p.title span.sub { font-family: Montserrat; line-height: 24px; font-size: 15px; color: #42d3fa; }
.mainTreatment ul li a .con { position: relative; }
.mainTreatment ul li a .con p.exp { position: absolute; left: 0; top: 128px; width: 100%; line-height: 22px; font-size: 18px; color: #fff; text-align: center; font-weight: 500; z-index: 20; 
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.mainTreatment ul li a:hover .con p.exp { top: 82px; }
.mainTreatment ul li a .con p.img {}
.mainTreatment ul li a .con p.img img {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.mainTreatment ul li a:hover .con p.img img {
	filter: brightness(44%);
}
.mainTreatment ul li a .con:after { content: " "; position: absolute; left: 50%; top: 148px; width: 60px; height: 60px; background: #42d3fa url('../images/common/icon_arrow_right_black.png') center center no-repeat; margin-left: -30px; opacity: 0;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.mainTreatment ul li a:hover .con:after { top: 168px; opacity: 1; }

/* mind */

.mainMind { display: flex; align-items: center; justify-content: center; padding: 100px 0; }
.mainMind p.slogan { height: 54px; font-family: 'MaruBuri'; line-height: 54px; font-size: 42px; letter-spacing: -0.05em; margin-right: 125px; }
.mainMind p.slogan span.dot { display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline; position: relative; height: 54px; }
.mainMind p.slogan span.dot:after { content: " "; position: absolute; left: 50%; top: -14px; width: 8px; height: 8px; background-color: #42d3fa; margin-left: -4px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.mainMind ul {}
.mainMind ul li { display: flex; align-items: center; justify-content: flex-start; gap:  0 18px; margin-bottom: 12px; }
.mainMind ul li:last-child { margin-bottom: 0; }
.mainMind ul li span.num { display: block; width: 50px; height: 50px; font-family: 'Montserrat'; line-height: 50px; font-size: 18px; color: #fff; text-align: center; font-weight: 700; background-color: #99d9ea;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.mainMind ul li span.text { font-family: 'MaruBuri'; line-height: 30px; font-size: 20px; letter-spacing: -0.05em; }

/* community */

.mainCommunity { display: flex; justify-content: center; gap: 0 50px; background-color: #f1f1f1; padding: 52px 0 56px; margin-bottom: 100px; }
.mainCommunity > div { width: 400px; }
.mainCommunity > div .top { position: relative; height: 83px; border-bottom: 1px solid #c9c9c9; margin-bottom: 35px; }
.mainCommunity > div .top span.sub { line-height: 24px; font-size: 14px; color: #454545; text-transform: uppercase; }
.mainCommunity > div .top span.main { display: block; font-family: 'MaruBuri'; line-height: 42px; font-size: 32px; font-weight: 500; letter-spacing: -0.05em; }
.mainCommunity > div .top a.btnMore { position: absolute; right: 0; top: 24px; }
a.btnMore { display: block; width: 30px; height: 30px; text-indent: -9999px; background: url('../images/common/icon_plus_blue.png') center center no-repeat; }
.mainCommunity > div .board {}
.mainCommunity > div .board ul {}
.mainCommunity > div .board ul li { position: relative; height: 26px; line-height: 26px; font-size: 16px; padding-right: 105px; margin-bottom: 10px; overflow: hidden; }
.mainCommunity > div .board ul li:last-child { margin-bottom: 0; }
.mainCommunity > div .board ul li a { color: #000; text-decoration: none; }
.mainCommunity > div .board ul li a:hover { text-decoration: underline; }
.mainCommunity > div .board ul li span.date { position: absolute; right: 0; top: 0; font-size: 15px; color: #959595; font-weight: 300; }

.mainCommunity .view { position: relative; }
.mainCommunity .view p.title { text-align: center; padding: 7px 0; margin-bottom: 36px; }
.mainCommunity .view p.exp { line-height: 26px; font-size: 16px; font-weight: 300; padding-left: 58px; }
.mainCommunity .view a { position: absolute; right: 34px; bottom: 0; }

/* info */

.mainInfo { display: flex; justify-content: center; gap: 0 50px; margin-bottom: 100px; }
.mainInfo .content { position: relative; }
.mainInfo .content p.top  { position: relative; height: 83px; border-bottom: 1px solid #c9c9c9; margin-bottom: 16px; }
.mainInfo .content p.top span.main { display: block; font-family: 'MaruBuri'; line-height: 46px; font-size: 32px; font-weight: 500; letter-spacing: -0.05em; }
.mainInfo .content p.top span.sub { line-height: 22px; font-size: 14px; color: #454545; text-transform: uppercase; }
.mainInfo .content p.text { line-height: 24px; font-size: 16px; font-weight: 300; }

.mainInfo .time { width: 380px; }
.mainInfo .time ul.hour { margin-top: 24px; }
.mainInfo .time ul.hour li { line-height: 30px; font-size: 20px; margin-bottom: 4px; }
.mainInfo .time ul.hour li:last-child { margin-bottom: 0; }
.mainInfo .time ul.hour li span.title { display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline; width: 140px; }
.mainInfo .time ul.hour li span.exp { font-family: 'Montserrat'; color: #55c3e0; font-weight: 700; }
.mainInfo .time p.lunch { display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline; height: 38px; line-height: 38px; font-size: 16px; background-color: #f1f1f1; padding: 0 24px; margin-top: 10px; 
	-moz-border-radius: 19px;
	-webkit-border-radius: 19px;
	border-radius: 19px;
}
.mainInfo .time p.lunch strong { font-family: 'Montserrat'; font-weight: 700; }
.mainInfo .time p.etc { line-height: 22px; font-size: 16px; font-weight: 300; margin-top: 12px; }

.mainInfo .map { width: 440px; }
.mainInfo .map p.top { position: absolute; left: 26px; top: 22px; height: auto; border-bottom: 0; }
.mainInfo .map a { display: block; overflow: hidden;
	-moz-border-radius: 14px;
	-webkit-border-radius: 14px;
	border-radius: 14px;
}

.mainInfo .reservation { width: 380px; }
.mainInfo .reservation ul.contact { margin-top: 26px; }
.mainInfo .reservation ul.contact li { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 18px; }
.mainInfo .reservation ul.contact li:last-child { margin-bottom: 0; }
.mainInfo .reservation ul.contact li p.icon { width: 73px; height: 73px; text-align: center; background-color: #f1f1f1; margin-right: 28px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.mainInfo .reservation ul.contact li p.icon:before { content: ""; display: inline-block; height: 100%; vertical-align: middle;}
.mainInfo .reservation ul.contact li p.icon img { vertical-align:middle;}
.mainInfo .reservation ul.contact li .con {}
.mainInfo .reservation ul.contact li .con p.title { line-height: 26px; font-size: 18px; font-weight: 500; margin-bottom: 6px; }
a.reserveBtn { display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline; height: 34px; line-height: 32px; font-size: 17px; color: #0bac52; font-weight: 800; text-decoration: none; /*letter-spacing: -0.03em;*/ border: 1px solid #03c75a; background: url('../images/common/icon_arrow_right_navy.png') right 16px center no-repeat; padding: 0 42px 0 20px;
	-moz-border-radius: 17px;
	-webkit-border-radius: 17px;
	border-radius: 17px;
}
a.reserveBtn:hover { background-position: right 12px center; }
a.reserveBtn span { font-size: 15px; color: #2c59d0; margin-left: 8px; }
a.reserveBtn.large { height: 54px; line-height: 52px; font-size: 22px; background-position: right 24px center; padding: 0 52px 0 30px;
	-moz-border-radius: 27px;
	-webkit-border-radius: 27px;
	border-radius: 27px;
}
a.reserveBtn.large:hover { background-position: right 18px center; }
a.reserveBtn.large span { font-size: 18px; margin-left: 12px; }
.mainInfo .reservation ul.contact li .con a.call { font-family: 'Montserrat'; line-height: 38px; font-size: 34px; color: #55c3e0; font-weight: 700; text-decoration: none; }


/* mediaquery for tab */

@media only screen and (min-width: 801px) and (max-width: 1200px) {

}

/* mediaquery for mobile */

@media only screen and (max-width: 800px) {

}