@charset "UTF-8";
/*@mixin pc {
  @media screen and (min-width: ($pc)) {
    @content;
  }
}

@mixin tab {
  	@media  screen and (min-width: ($sp + 1)) and (max-width: ($pc + 1)) {
    @content;
  }
}

@mixin sp {
  @media screen and (max-width: ($sp)) {
    @content;
  }
}
*/
/*	@media screen and (max-width:1250px) {

		調整できないときは任意の数字に打ち換えて調整
}	*/
/*  @include sp {
    display: block;
    margin-bottom: 0;
  }
*/
/* a{
    color: blue;
    &:hover {
      color: red;
    }*/
/*@mixin setcss{
  width: 500px;
	height: 500px;
	margin: 0 auto;
	background: #000;
 }
.set {
  @include setcss;
}*/
/******TAGZONE******/
html {
  font-size: 62.5%;
  /* ルートのフォントサイズを10pxに設定　あとはremで指定　 */ }

body, p, h1, h2, h3, h4, h5, h6, dl, dt, dd {
  margin: 0;
  padding: 0;
  font-family: 'Noto Sans JP', sans-serif;
  vertical-align: baseline;
  background: transparent;
  border: 0;
  outline: 0; }

.suji {
  font-family: 'Lato', sans-serif; }

.eiji {
  font-family: 'Josefin Sans', sans-serif; }

.mon {
  font-family: 'Montserrat', sans-serif; }

.copycopy::before {
  content: '';
  display: block;
  width: 20px;
  height: 11px;
  background: url("../img/aro_s_w.svg") no-repeat;
  background-size: contain;
  position: absolute;
  bottom: calc(50% - 11px/2);
  right: 10px; }
.copycopy::before {
  content: '';
  display: block;
  width: 1px;
  height: 20px;
  background: #4B3F33;
  position: absolute;
  bottom: -20px;
  left: calc(50% - 1px/2); }

@media screen and (max-width: 959px) {
  .pcon {
    display: none; } }

@media screen and (max-width: 767px) {
  .tabonpc {
    display: none; } }

@media screen and (min-width: 960px) {
  .tabonsp {
    display: none; } }

@media screen and (min-width: 960px) {
  .spon {
    display: none; } }
@media screen and (max-width: 959px) {
  .spon {
    display: none; } }
@media screen and (max-width: 767px) {
  .spon {
    display: block; } }

.fade {
  transition: all 0.5s; }
  .fade:hover {
    opacity: 0.7; }

*,
*::before,
*::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
  -webkit-text-size-adjust: none;
  line-height: 1.3;
  word-break: break-all;
  font-size: 1.6rem;
  letter-spacing: 0.07rem;
  font-weight: 500;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  color: #333; }
  @media screen and (max-width: 767px) {
    *,
    *::before,
    *::after {
      font-size: 1.3rem; } }

@media screen and (min-width: 960px) {
  *::before,
  *::after {
    transition: all 0.3s ease; } }

.tra {
  transition: all 0.8s; }

::selection {
  color: #fff;
  background-color: #3abec1; }

.wm {
  width: 100%; }

@media screen and (min-width: 960px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none; } }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

img {
  border: none;
  vertical-align: bottom;
  width: 100%; }

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none; }

a {
  text-decoration: none;
  outline: none;
  color: #333;
  transition: all 0.5s ease; }

a:hover {
  text-decoration: none;
  opacity: 0.7; }

pre, code {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden; }

.clearfix {
  min-height: 1px; }

* html .clearfix {
  height: 1px; }

.mb5 {
  margin: 0 0 5px; }

.mb10 {
  margin: 0 0 10px; }

.mb20 {
  margin: 0 0 20px; }

.mb30 {
  margin: 0 0 30px; }

.mb40 {
  margin: 0 0 40px; }

.t_c {
  text-align: center; }

.bwrap {
  max-width: 1240px;
  padding: 0 20px;
  margin: 0 auto; }
  .bwrap h1 {
    font-size: 1.2rem; }
  .bwrap .logo {
    width: 300px;
    padding: 20px 0; }
  .bwrap nav ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 20px; }
    .bwrap nav ul li {
      margin: 0 5px 5px;
      background: #EEE; }
      .bwrap nav ul li a {
        display: block;
        padding: 15px; }
        .bwrap nav ul li a:hover {
          text-decoration: none; }
  .bwrap .topi {
    background: #FFF9EB;
    text-align: center;
    line-height: 2;
    padding: 30px;
    margin: 0 0 20px; }
  .bwrap .blogbox h2 {
    position: relative;
    padding: 1.5rem 2rem;
    color: #fff;
    border-radius: 10px;
    background: #65C2E9;
    font-size: 2.0rem;
    margin: 30px 0 30px; }
    .bwrap .blogbox h2::before {
      position: absolute;
      bottom: -9px;
      left: 1em;
      width: 0;
      height: 0;
      content: '';
      border-width: 10px 10px 0 10px;
      border-style: solid;
      border-color: #65C2E9 transparent transparent transparent; }
  .bwrap .blogbox ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .bwrap .blogbox ul li {
      width: calc((100% / 3) - 20px);
      background: #F2FAFC;
      margin: 0 0 20px;
      padding: 20px; }
      @media screen and (max-width: 767px) {
        .bwrap .blogbox ul li {
          width: 100%; } }
      .bwrap .blogbox ul li ul {
        justify-content: flex-end;
        margin: 0 0 10px; }
      .bwrap .blogbox ul li li {
        background: #53AF9B;
        padding: 5px;
        border-radius: 10px;
        width: inherit;
        color: #FFF;
        font-size: 1.3rem;
        margin: 0; }
  .bwrap .blogbox .more {
    text-align: center;
    font-size: 1.4rem; }
  .bwrap .blogbox a:hover {
    text-decoration: none; }
  .bwrap h3 {
    text-align: center;
    font-size: 1.7rem;
    line-height: 1.3;
    margin: 0 0 10px;
    padding: 15px 0;
    background: #FFB36B;
    color: #FFF; }
    .bwrap h3 a {
      color: #FFF;
      display: block; }
  .bwrap .day {
    text-align: right;
    font-size: 1.3rem;
    margin: 0 0 10px; }
  .bwrap .bassui {
    margin: 0 0 30px; }
  .bwrap .btn {
    text-align: center;
    padding: 30px 0 30px; }
    .bwrap .btn a {
      border-radius: 10px;
      background: #F46B6B;
      color: #FFF;
      display: inline-block;
      padding: 10px; }
  .bwrap footer {
    padding: 40px 0 0; }

.bwrap .contwrap {
  display: flex;
  justify-content: space-between; }
  @media screen and (max-width: 767px) {
    .bwrap .contwrap {
      display: inherit; } }
.bwrap .leftbox {
  width: 70.83%; }
  @media screen and (max-width: 767px) {
    .bwrap .leftbox {
      width: 100%;
      margin: 0 0 30px; } }
  .bwrap .leftbox img {
    width: inherit;
    max-width: 100%; }
  .bwrap .leftbox h2 {
    position: relative;
    padding: 1.5rem 2rem;
    color: #fff;
    border-radius: 10px;
    background: #65C2E9;
    font-size: 2.0rem;
    margin: 0 0 30px; }
    .bwrap .leftbox h2::before {
      position: absolute;
      bottom: -9px;
      left: 1em;
      width: 0;
      height: 0;
      content: '';
      border-width: 10px 10px 0 10px;
      border-style: solid;
      border-color: #65C2E9 transparent transparent transparent; }
  .bwrap .leftbox .cattitle {
    margin: 0 0 10px; }
.bwrap .blogall {
  margin: 0 0 30px; }
.bwrap .rightbox {
  width: 25%; }
  @media screen and (max-width: 767px) {
    .bwrap .rightbox {
      width: 100%; } }
  .bwrap .rightbox h4 {
    padding: 15px;
    text-align: center;
    background: #D4EDDA; }
  .bwrap .rightbox ul {
    padding: 0 5px 5px;
    background: #D4EDDA; }
  .bwrap .rightbox li {
    background: #FFF; }
    .bwrap .rightbox li a {
      display: block;
      padding: 15px;
      margin: 0 0 5px; }
  .bwrap .rightbox li:last-child a {
    margin: 0; }
.bwrap .kate {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 10px; }
  .bwrap .kate li {
    background: #53AF9B;
    padding: 5px;
    border-radius: 10px;
    width: inherit;
    color: #FFF;
    font-size: 1.3rem;
    margin: 0; }
.bwrap .blogmain {
  line-height: 2.0; }
.bwrap .pagenation02 {
  margin: 70px 0 20px;
  display: flex; }
  @media screen and (max-width: 767px) {
    .bwrap .pagenation02 {
      margin: 40px 0 20px; } }
.bwrap .pagenation02 .old {
  width: 50%; }
.bwrap .pagenation02 .new {
  width: 50%;
  text-align: right; }
.bwrap .blogbox02 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  .bwrap .blogbox02 dl {
    width: calc((100% / 3) - 20px);
    background: #F2FAFC;
    margin: 0 0 20px;
    padding: 20px; }
    @media screen and (max-width: 767px) {
      .bwrap .blogbox02 dl {
        width: 100%; } }
  .bwrap .blogbox02 dt {
    text-align: center;
    font-size: 1.7rem;
    line-height: 1.3;
    margin: 0 0 10px;
    padding: 15px 0;
    background: #FFB36B;
    color: #FFF; }
    .bwrap .blogbox02 dt a {
      color: #FFF;
      display: block; }
.bwrap .fuki {
  position: relative;
  padding: 1.5rem 2rem;
  color: #fff;
  border-radius: 10px;
  background: #65C2E9;
  font-size: 2.0rem;
  margin: 0 0 30px; }
  .bwrap .fuki::before {
    position: absolute;
    bottom: -9px;
    left: 1em;
    width: 0;
    height: 0;
    content: '';
    border-width: 10px 10px 0 10px;
    border-style: solid;
    border-color: #65C2E9 transparent transparent transparent; }
.bwrap .blogbox02.work {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  .bwrap .blogbox02.work dl {
    width: calc((100% / 3) - 20px);
    background: #F2FAFC;
    margin: 0 0 20px;
    padding: 20px; }
    @media screen and (max-width: 767px) {
      .bwrap .blogbox02.work dl {
        width: calc((100% / 2) - 20px); } }
.bwrap .blogbox03 table {
  width: 100%;
  margin: 0 0 20px; }
.bwrap .blogbox03 th {
  width: 30%;
  background: #FFF9EB;
  border: 1px solid #EEE;
  padding: 20px; }
.bwrap .blogbox03 td {
  background: #FFF;
  border: 1px solid #EEE;
  padding: 20px;
  text-align: right; }
.bwrap .blogbox03 .op {
  background: #FFF9EB;
  padding: 20px;
  margin: 0 0 30px; }
  .bwrap .blogbox03 .op h4 {
    font-weight: bold;
    margin: 0 20px 20px;
    padding: 10px 0 10px 10px;
    border-bottom: 2px dotted #FFB36B; }
  .bwrap .blogbox03 .op li {
    position: relative;
    padding: 0 0 0 20px;
    margin: 0 0 10px; }
    .bwrap .blogbox03 .op li::before {
      position: absolute;
      bottom: calc(50% - 15px/2);
      left: 0;
      content: '●';
      color: #FFB36B;
      line-height: 1; }
.bwrap .blogbox03.com td {
  background: #FFF;
  border: 1px solid #EEE;
  padding: 20px;
  text-align: left; }
.bwrap .blogbox04 table {
  width: 100%;
  margin: 0 0 50px; }
  @media screen and (max-width: 767px) {
    .bwrap .blogbox04 table {
      border-bottom: 1px solid #EEE; } }
.bwrap .blogbox04 th {
  width: 30%;
  background: #FFF9EB;
  border: 1px solid #EEE;
  padding: 40px 20px  40px 40px;
  text-align: left;
  box-sizing: border-box; }
  @media screen and (max-width: 767px) {
    .bwrap .blogbox04 th {
      display: block;
      padding: 20px 10px;
      border-right: none;
      width: 100%; } }
  .bwrap .blogbox04 th span {
    background: #F46B6B;
    color: #FFF;
    padding: 1px 10px;
    margin: 0 20px 0 0;
    float: right; }
.bwrap .blogbox04 td {
  padding: 20px;
  border: 1px solid #EEE; }
  @media screen and (max-width: 767px) {
    .bwrap .blogbox04 td {
      padding: 20px 10px;
      border-bottom: none;
      border-top: none;
      display: block;
      text-align: center; } }
.bwrap #namae, .bwrap #namae2, .bwrap #address_field, .bwrap #tel, .bwrap #mail01, .bwrap #mail02, .bwrap #add {
  width: 85%;
  border: 1px solid #DDD;
  padding: 10px; }
.bwrap .pos {
  width: 38%;
  border: 1px solid #DDD;
  padding: 10px; }
.bwrap #naiyou {
  height: 200px;
  width: 85%;
  border: 1px solid #DDD;
  padding: 10px; }
.bwrap .btn02 {
  display: flex;
  padding: 30px 0 30px; }
  .bwrap .btn02 a {
    border-radius: 10px;
    background: #F46B6B;
    color: #FFF;
    display: inline-block;
    padding: 10px; }