@charset "UTF-8";
#index #content {
  padding-bottom: 2em;
  overflow-x: hidden; }

@media screen and (min-width: 768px), print {
  #index #content {
    padding-bottom: 4em; }
  #index .container {
    padding-left: 16px;
    padding-right: 16px; } }
@media screen and (min-width: 992px) {
  #index .container {
    width: 960px; } }
#topimage {
  width: 100%; }

@media screen and (min-width: 768px), print {
  #topimage {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 14px; }
    #topimage .slick-dots {
      bottom: -35px; } }
#recruit_banner,
#prevention_banner {
  width: 100%; }

@media screen and (max-width: 767px) {
  #recruit_banner,
  #prevention_banner {
    margin-top: 12px; }
    #recruit_banner a img,
    #prevention_banner a img {
      width: 100%; } }
@media screen and (min-width: 768px) and (max-width: 991px), print {
  #recruit_banner,
  #prevention_banner {
    margin-top: 36px; }
    #recruit_banner a img,
    #prevention_banner a img {
      width: 100%; } }
@media screen and (min-width: 992px) {
  #recruit_banner,
  #prevention_banner {
    margin-top: 36px; }
    #recruit_banner a:hover img,
    #prevention_banner a:hover img {
      opacity: 0.7; } }
/*---
@media screen and (max-width: nth($breakpoint,$switch) - 1) { //スマホ
	#recruit_banner {
		a {
			@include wanted($width: 105px, $height: 63px, $url: "../../images/wanted.png", $shift: -6px);
		}
	}
}
@media screen and (min-width:nth($breakpoint,$switch)) and (max-width: nth($breakpoint,$infix-num - 1) - 1), print { //タブレットのみ
	#recruit_banner {
		a {
			@include wanted($width: 105px, $height: 63px, $url: "../../images/wanted.png", $shift: -6px);
		}
	}
}
@media screen and (min-width: nth($breakpoint,$infix-num - 1)) { //PCのみ
	#recruit_banner {
		a {
			@include wanted($url: "../../images/wanted.png");			
		}
	}
}
---*/
#intro {
  background-color: #e7f7f5;
  margin-top: 14px; }
  #intro .txt {
    padding: 17px 0; }
    #intro .txt p + ol {
      margin-top: 2px; }
    #intro .txt ol {
      padding-top: 0.15em;
      padding-bottom: 0.5em; }
      #intro .txt ol li {
        margin-left: 7px;
        padding-left: 24px;
        text-indent: -24px;
        border-bottom: 1px solid #c3ddda;
        padding-bottom: 2px; }
        #intro .txt ol li + li {
          margin-top: 6px; }
        #intro .txt ol li strong {
          background: linear-gradient(transparent 76%, #FC0 76%);
          margin: 0 0.25em; }
      #intro .txt ol li:nth-child(1) .num {
        color: #F69; }
      #intro .txt ol li:nth-child(2) .num {
        color: #8C3; }
      #intro .txt ol li:nth-child(3) .num {
        color: #3AE; }
      #intro .txt ol .num {
        display: inline-block;
        position: relative;
        top: 1px;
        font-size: 20px;
        font-weight: bold;
        line-height: 26px;
        width: 24px;
        text-indent: 0px; }
      #intro .txt ol + p {
        margin-top: 6px; }
  #intro .container::after {
    content: "";
    display: block;
    background: url(../../../images/intro_img.jpg) center center no-repeat;
    background-size: cover; }

@media screen and (max-width: 767px) {
  #intro .txt ol li strong {
    font-size: 16px; }
  #intro .container::after {
    width: calc(100% + 2*(20px - 14px/2));
    height: 0;
    padding-top: 50%;
    margin-left: -13px;
    margin-right: -13px; } }
@media screen and (min-width: 768px), print {
  #intro {
    margin-top: 40px; }
    #intro .txt {
      padding: 57px 37% 57px 0; }
      #intro .txt p + ol {
        margin-top: 12px; }
      #intro .txt ol {
        font-family: "Times New Roman","游ゴシック体",YuGothic,"游ゴシック","Yu Gothic","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",メイリオ,Meiryo,serif;
        font-size: 16px;
        font-weight: 500; }
        #intro .txt ol li {
          margin-left: 16px;
          margin-right: 24px;
          padding-left: 28px;
          text-indent: -28px;
          padding-bottom: 2px;
          line-height: 30px; }
          #intro .txt ol li + li {
            margin-top: 6px; }
          #intro .txt ol li strong {
            font-weight: bold; }
        #intro .txt ol .num {
          font-size: 28px;
          width: 28px;
          top: 2px; }
        #intro .txt ol .ten {
          letter-spacing: -0.35em; }
        #intro .txt ol + p {
          margin-top: 16px; }
    #intro .container {
      position: relative; }
      #intro .container::after {
        height: 100%;
        width: 35%;
        position: absolute;
        right: 0px;
        top: 0px; }
      #intro .container::before {
        content: "";
        display: block;
        position: absolute;
        height: 100%;
        width: 48px;
        background: linear-gradient(to top left, rgba(231, 247, 245, 0) 50%, #e7f7f5 50.5%);
        top: 0px;
        left: 65%;
        z-index: 10; } }
@media screen and (min-width: 768px) and (max-width: 991px), print {
  #intro .txt ol li strong {
    font-size: 20px; } }
@media screen and (min-width: 992px) {
  #intro .txt {
    line-height: 30px; }
    #intro .txt p {
      font-size: 18px; }
    #intro .txt ol {
      font-size: 20px; }
      #intro .txt ol li {
        margin-left: 24px;
        padding-left: 32px;
        padding-bottom: 3px;
        text-indent: -32px;
        line-height: 32px; }
        #intro .txt ol li + li {
          margin-top: 8px; }
      #intro .txt ol .num {
        font-size: 32px;
        width: 32px;
        top: 2px; }
      #intro .txt ol strong {
        font-size: 24px; } }
#info {
  display: flex; }
  #info .time .txt01 {
    color: #4bbab3;
    font-size: 10px;
    line-height: 16px;
    margin-top: 0.5em; }
  #info .time .colored-1 {
    color: #F69; }
  #info .time .colored-2 {
    color: #39F; }
  #info .tel {
    background-color: #cd5;
    display: flex;
    justify-content: center; }
    #info .tel p + p {
      margin-left: 1em; }
    #info .tel a {
      display: block; }
      #info .tel a:link, #info .tel a:visited {
        background-color: #cd5; }
      #info .tel a:hover, #info .tel a:active {
        background-color: #e0f35e; }
    #info .tel img {
      height: 48px; }

@media screen and (max-width: 767px) {
  #info {
    flex-direction: column; }
    #info .basic_info {
      order: 2;
      margin-top: 1em; }
      #info .basic_info .english_ok {
        margin-bottom: 0.5em; }
    #info #calendar {
      order: 1;
      margin-top: calc(-0.5em - 96px + 28px);
      padding-top: calc(96px + 0.5em); }
    #info #access {
      margin-top: calc(-0.5em - 96px);
      padding-top: calc(96px + 0.5em); }
      #info #access .txt01 {
        padding-top: 9px; }
      #info #access .txt02 {
        margin-top: 4px; } }
@media screen and (min-width: 768px), print {
  #info {
    margin-top: 56px;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: stretch; }
    #info .basic_info, #info #calendar {
      flex-basis: calc(50% - 16px); }
    #info .english_ok {
      margin-bottom: 1em; }
    #info .time .txt01 {
      font-size: 14px;
      line-height: 24px;
      margin-top: 0.5em; }
    #info #calendar {
      margin-top: calc(-0.75em - 134px);
      padding-top: calc(134px + 0.75em); }
    #info #access {
      font-size: 14px;
      line-height: 24px;
      margin-top: calc(-0.75em - 134px);
      padding-top: calc(134px + 0.75em); }
      #info #access .txt01 {
        padding-top: 10px; }
      #info #access .txt02 {
        line-height: 22px;
        padding-bottom: 1px;
        margin-top: 5px; } }
@media screen and (min-width: 992px) {
  #info .time .kerning {
    letter-spacing: -0.1em; }
  #info #calendar {
    margin-top: calc(-0.5em - 164px);
    padding-top: calc(164px + 0.5em); }
  #info #access {
    margin-top: calc(-0.5em - 164px);
    padding-top: calc(164px + 0.5em);
    font-size: 16px;
    line-height: 24px; }
    #info #access .txt01 {
      padding-top: 11px; }
    #info #access .txt02 {
      font-size: 14px;
      line-height: 22px; }
  #info .tel p + p {
    margin-left: 1em; }
  #info .tel img {
    height: 72px; } }
#googlemap {
  margin-top: 28px;
  position: relative;
  width: 100%; }
  #googlemap:before {
    content: "";
    display: block;
    padding-top: 40%; }
  #googlemap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none; }

#insta_follow_me {
  margin-left: auto;
  margin-right: auto; }
  #insta_follow_me img {
    width: 100%; }
  #insta_follow_me a:hover img {
    opacity: 0.7; }

@media screen and (max-width: 767px) {
  #insta_follow_me {
    margin-top: 28px; } }
@media screen and (min-width: 768px), print {
  #insta_follow_me {
    margin-top: 56px; } }