@import url(base.css);
/***************************************************************************  COMMON STYLE  **************************************************************************/
@import "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Sora:wght@400;700;800&display=swap";
.noto { font-family: 'Noto Sans JP', sans-serif; }

.sorea { font-family: 'Sora', sans-serif; }

html { font-size: 62.5%; }

body { background: #FFFFFF url(../images/common/bg.jpg) repeat top -67px center; font-size: 1.4rem; line-height: 1.5; color: #666666; font-family: 'Noto Sans JP', sans-serif; }

a { color: #f56161; }

body.fixed { overflow: hidden; }

.inner-lg { width: 1100px; margin: 0 auto; }

.inner-md { width: 1020px; margin: 0 auto; }

.inner-sm { width: 939px; margin: 0 auto; }

.error { display: block; font-size: 1.2rem; color: red; }

#header { width: 100%; z-index: 999; }
#header .header-bar { display: flex; justify-content: space-between; background: #fff url("../images/common/header-bg.png") no-repeat bottom center; border-radius: 0 0 30px 30px; box-shadow: 0px 0px 15px #c9c9c9; padding-bottom: 2px; }
#header .header-bar .main-menu .menu { display: flex; align-items: center; }
#header .header-bar .main-menu .menu li { position: relative; }
#header .header-bar .main-menu .menu li a { color: #fff; display: block; text-align: center; width: 100%; height: 100%; padding: 18px 0; z-index: 2; }
#header .header-bar .main-menu .menu li a span { display: flex; align-items: center; justify-content: center; font-size: 2rem; font-weight: bold; line-height: 1; min-height: 40px; margin-bottom: 4px; }
#header .header-bar .main-menu .menu li a small { font-size: 1.2rem; }
#header .header-bar .main-menu .menu li > ul { position: absolute; top: 104px; left: 0; z-index: 1; overflow: hidden; display: none; }
#header .header-bar .main-menu .menu li > ul > li { width: 130px; border-bottom: 1px dotted #fff; }
#header .header-bar .main-menu .menu li > ul > li:last-child { border-bottom: none; }
#header .header-bar .main-menu .menu li > ul > li > a { display: block; text-align: center; font-size: 1.5rem; padding: 13px 2px; }
#header .header-bar .main-menu .menu > li { width: 130px; margin-right: 4px; height: 104px; display: flex; align-items: center; justify-content: center; flex-direction: column; border-bottom: 4px solid #fff; }
#header .header-bar .main-menu .menu li.pink-btn { background: #ffb2b2; }
#header .header-bar .main-menu .menu li.pink-btn a { background: #ffb2b2; }
#header .header-bar .main-menu .menu li.pink-btn > ul > li { background: #ffb2b2; }
#header .header-bar .main-menu .menu li.blue-btn { background: #8addff; }
#header .header-bar .main-menu .menu li.blue-btn a { background: #8addff; }
#header .header-bar .main-menu .menu li.blue-btn > ul > li { background: #8addff; }
#header .header-bar .main-menu .menu li.yellow-ntn { background: #d3d1a5; }
#header .header-bar .main-menu .menu li.yellow-ntn a { background: #d3d1a5; }
#header .header-bar .main-menu .menu li.yellow-ntn > ul > li { background: #d3d1a5; }

#content { width: 100%; }

#footer { width: 100%; padding: 47px 0 28px; }
#footer .copyright { text-align: center; font-size: 1.1rem; color: #999; letter-spacing: 1px; }

.area .area-box { position: relative; background-color: #fff; border-radius: 31px; padding: 67px 40px 56px; box-shadow: 0px 0px 15px #c9c9c9; }
.area .area-icon-left { position: absolute; width: 272px; top: -29px; left: 55px; }
.area .area-icon-right { position: absolute; width: 64px; top: -24px; right: 35px; }
.area .area-button { text-align: center; }
.area .area-button a { display: inline-block; background-color: #ffb2b2; width: 510px; padding: 7px 0 9px; border-radius: 20px; color: #fff; font-size: 1.6rem; box-shadow: 2px 3px #dddddd; }

.sp { display: none; }

@media (max-width: 1230px) and (min-width: 769px) { body { width: 1349px; } }
@media (min-width: 769px) { #header.scrollX { width: 1349px; }
  #header .header-bar .logo { margin-left: 44px; transform: translateY(-11px); }
  #header .header-bar .main-menu .menu li a { -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease; }
  #header .header-bar .main-menu .menu li a:hover { opacity: 0.5; } }
/*IE FIX*/
@media all and (-ms-high-contrast: none) { #header .header-bar .main-menu .menu li a { display: table; }
  #header .header-bar .main-menu .menu li a span { display: table-cell; text-align: center; vertical-align: middle; }
  #header .header-bar .main-menu .menu li a small { display: table-row; } }
@media (max-width: 768px) { .pc { display: none; }
  .sp { display: block; }
  .inner-lg { width: 100%; padding: 0 5px; }
  .inner-md { width: 100%; padding: 0 5px; }
  .inner-sm { width: 100%; padding: 0 5px; }
  body { background: #FFFFFF url(../images/common/bg-sp.jpg) no-repeat top center/100%; }
  .hamburger { width: 50px; height: 50px; padding: 0 5px; z-index: 9991; display: flex; justify-content: center; flex-direction: column; text-align: center; margin-right: 1px; }
  .hamburger span { display: block; height: 7px; width: 100%; background: #fff; border-radius: 6px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; transition: .25s ease-in-out; }
  .hamburger span:nth-child(1) { margin-bottom: 6px; }
  .hamburger span:nth-child(2) { opacity: 1; }
  .hamburger span:nth-child(3) { margin-top: 6px; }
  .hamburger.open span:nth-child(1) { margin-bottom: -7px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); }
  .hamburger.open span:nth-child(2) { opacity: 0; }
  .hamburger.open span:nth-child(3) { margin-top: -7px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); }
  #header { position: fixed; top: 0; left: 0; right: 0; }
  #header .header-bar { background: #fff url("../images/common/header-bg-sp.png") no-repeat bottom center/100%; padding: 0 4px; border-radius: 0 0 15px 15px; }
  #header .header-bar .header-sp { width: 100%; display: flex; justify-content: space-between; position: relative; z-index: 1; }
  #header .header-bar .header-sp:after { content: ""; background-color: #ffb2b2; position: absolute; left: 0; top: 0; width: 100%; height: 50px; z-index: -1; }
  #header .header-bar .logo { width: 169px; margin-bottom: 11px; transform: translate(-11px, -5px); }
  #header .header-bar .main-menu { position: fixed; top: 0; right: 0; height: 100vh; background-color: #ffb2b2; width: 66.8%; margin: 0; padding: 65px 0 0 0; transform: translateX(100%); transition: all 300ms linear; }
  #header .header-bar .main-menu .menu { display: block; }
  #header .header-bar .main-menu .menu > li { width: 100%; height: auto; border-bottom: 2px solid #ffdada; text-align: left; }
  #header .header-bar .main-menu .menu > li:last-child { border-bottom: none; }
  #header .header-bar .main-menu .menu li a { padding: 8px 29px; }
  #header .header-bar .main-menu .menu li a span { min-height: auto; display: block; line-height: 1.5; margin-bottom: 0; font-size: 2rem; letter-spacing: 1px; }
  #header .header-bar .main-menu .menu li a small { display: none; }
  #header .header-bar .main-menu .menu li > ul { position: static; z-index: 0; width: 100%; margin-top: -3px; display: block; }
  #header .header-bar .main-menu .menu li > ul > li { width: 100%; border-bottom: none; }
  #header .header-bar .main-menu .menu li > ul > li:nth-child(2) a { padding: 0 29px 12px; }
  #header .header-bar .main-menu .menu li > ul > li > a { padding: 0 29px 9px; font-size: 1.4rem; }
  #header .header-bar .main-menu .menu li.pink-btn { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.pink-btn a { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.pink-btn > ul > li { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.blue-btn { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.blue-btn a { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.blue-btn > ul > li { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.yellow-ntn { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.yellow-ntn a { background: none; text-align: left; }
  #header .header-bar .main-menu .menu li.yellow-ntn > ul > li { background: none; text-align: left; }
  #header .header-bar .main-menu.toggle { transform: translateX(0); }
  #footer { padding: 20px 0 15px; }
  #footer .copyright { font-size: 1rem; }
  .area .area-box { border-radius: 15px; }
  .area .area-icon-left { width: 188px; top: -22px; left: 10px; }
  .area .area-button { padding: 0 10px; }
  .area .area-button a { width: 100%; max-width: 510px; border-style: 2px 3.5px #dddddd; } }

/*# sourceMappingURL=common.css.map */