@charset "utf-8";

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  background: transparent;
  border: 0;
  font-size: 100%;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

ol {
  counter-reset: li;
}

img {
  vertical-align: bottom;
}

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

nav ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

/* change colours to suit your needs */
ins {
  background-color: #ffff99;
  color: #232323;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ffff99;
  color: #232323;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

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

/* change border colour to suit your needs */
hr {
  border: 0;
  border-top: 1px solid #cccccc;
  display: block;
  height: 1px;
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

ul li {
  list-style-type: none;
}

/*IE対応*/
#contactForm select::-ms-expand {
  display: none;
}

input[type=submit],
input[type=button] {
  -webkit-appearance: button;
          appearance: button;
  border: none;
  border-radius: 0;
  -webkit-box-sizing: content-box;
          box-sizing: border-box;
  cursor: pointer;
}

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}


/*#########################################################*\

$common

\*#########################################################*/

body,
html {
  height: 100%;
  min-width: 1160px;
}

* {
  box-sizing: border-box;
}

body {
  color: #333333;
  font-family: "Noto Sans JP", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-feature-settings: "palt";

/* font-family:"Noto Serif JP", "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif; */
  font-size: 1em;
  font-weight: 400;
  height: 100%;
  line-height: 1.8;
  margin: 0;
  padding: 0;
  text-align: left;
  -webkit-text-size-adjust: 100%;
}

.en {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
}

@media (max-width: 767px) {
  body,
  html {
    min-width: 100% !important;
  }

  body {
    word-wrap: break-word;
  }
}


/*#########################################################*\

$Loading

\*#########################################################*/


.loading {
  background-color: #ffffff;
  height: 100vh;
  left: 0;
  opacity: 1;
  position: fixed;
  top: 0;
  transition: all 1s;
  visibility: visible;
  width: 100vw;
  z-index: 9999;
}

.loading.is-active {
  opacity: 0;
  visibility: hidden;
}

.loading-animation {
  align-items: center;
  background-color: #ffffff;
  display: flex;
  height: 100vh;
  justify-content: center;
  opacity: 0;
  transition: all 1s;
  visibility: hidden;
  width: 100vw;
  z-index: 9999;
}

.loading-animation.is-active {
  opacity: 1;
  visibility: visible;
}

/* fadeUpをするアイコンの動き */
.fadeUp {
  animation-duration: .8s;
  animation-fill-mode: forwards;
  animation-name: fadeUpAnime;
  opacity: 0;
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}




/*#########################################################*\

$ドットを被せる（背景）

\*#########################################################*/
.layer-dot {
  position: relative;
}

.layer-dot::after {
  background-color: rgba(0, 0, 0, .3);
  background-image: radial-gradient(#000000 20%, transparent 0), radial-gradient(#000000 20%, transparent 0);
  background-position: 0 0, 10px 10px;
  background-size: 4px 4px;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

/*#########################################################*\

$リンク系

\*#########################################################*/

a {
  background: transparent;
  color: #3fa037;
  font-size: 100%;
  margin: 0;
  padding: 0;
  text-decoration: underline;
  vertical-align: baseline;
}

a:hover {
  opacity: .8;
  text-decoration: none;
}

a.disabledLink {
  pointer-events: none;
}

a.blank[target="_blank"] {
  position: relative;
}

a.blank[target="_blank"]:after {
  background: url(../images/ico_blank.svg) no-repeat center right;
  content: "";
  display: inline-block;
  height: 1.6em;
  vertical-align: middle;
  width: 1.6em;
}

a[href$=".pdf"] {
  background: url(../images/ico_pdf.svg) no-repeat center right;
  background-size: 22px 23px;
  content: "";
  margin: 0;
  padding: 2px 27px 2px 0;
  text-indent: -1em;
}

a.no[href$=".pdf"] {
  background: none;
  padding: 2px 0;
  text-indent: 0;
}

a[href$=".doc"] {
  background: url(../images/ico_doc.svg) no-repeat center right;
  background-size: 23px;
  content: "";
  display: inline-block;
  margin: 0;
  padding: 2px 27px 2px 0;
}

a[href$=".xls"] {
  background: url(../images/ico_xls.svg) no-repeat center right;
  background-size: 23px;
  content: "";
  display: inline-block;
  margin: 0;
  padding: 2px 27px 2px 0;
}



/*#########################################################*\

$photo_link

\*#########################################################*/


.photo_link a {
  display: block;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.photo_link img {
  display: block;
  transition-duration: .3s;
}

.photo_link:hover img {
  transform: scale(1.1);
  transition-duration: .3s;
}



/*#########################################################*\

$余白系

\*#########################################################*/
.mt0 {
  margin-top: 0 !important;
}
.mt5 {
  margin-top: 5px !important;
}
.mt10 {
  margin-top: 10px !important;
}
.mt15 {
  margin-top: 15px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt25 {
  margin-top: 25px !important;
}
.mt30 {
  margin-top: 30px !important;
}
.mt35 {
  margin-top: 35px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mt45 {
  margin-top: 45px !important;
}
.mt50 {
  margin-top: 50px !important;
}
.mt55 {
  margin-top: 55px !important;
}
.mt60 {
  margin-top: 60px !important;
}
.mt65 {
  margin-top: 65px !important;
}
.mt70 {
  margin-top: 70px !important;
}
.mt75 {
  margin-top: 75px !important;
}
.mt80 {
  margin-top: 80px !important;
}
.mt85 {
  margin-top: 85px !important;
}
.mt90 {
  margin-top: 90px !important;
}
.mt95 {
  margin-top: 95px !important;
}
.mt100 {
  margin-top: 100px !important;
}
.mr0 {
  margin-right: 0 !important;
}
.mr5 {
  margin-right: 5px !important;
}
.mr10 {
  margin-right: 10px !important;
}
.mr15 {
  margin-right: 15px !important;
}
.mr20 {
  margin-right: 20px !important;
}
.mr25 {
  margin-right: 25px !important;
}
.mr30 {
  margin-right: 30px !important;
}
.mr35 {
  margin-right: 35px !important;
}
.mr40 {
  margin-right: 40px !important;
}
.mr45 {
  margin-right: 45px !important;
}
.mr50 {
  margin-right: 50px !important;
}
.mr55 {
  margin-right: 55px !important;
}
.mr60 {
  margin-right: 60px !important;
}
.mr65 {
  margin-right: 65px !important;
}
.mr70 {
  margin-right: 70px !important;
}
.mr75 {
  margin-right: 75px !important;
}
.mr80 {
  margin-right: 80px !important;
}
.mr85 {
  margin-right: 85px !important;
}
.mr90 {
  margin-right: 90px !important;
}
.mr95 {
  margin-right: 95px !important;
}
.mr100 {
  margin-right: 100px !important;
}
.mb0 {
  margin-bottom: 0 !important;
}
.mb5 {
  margin-bottom: 5px !important;
}
.mb10 {
  margin-bottom: 10px !important;
}
.mb15 {
  margin-bottom: 15px !important;
}
.mb20 {
  margin-bottom: 20px !important;
}
.mb25 {
  margin-bottom: 25px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.mb35 {
  margin-bottom: 35px !important;
}
.mb40 {
  margin-bottom: 40px !important;
}
.mb45 {
  margin-bottom: 45px !important;
}
.mb50 {
  margin-bottom: 50px !important;
}
.mb55 {
  margin-bottom: 55px !important;
}
.mb60 {
  margin-bottom: 60px !important;
}
.mb65 {
  margin-bottom: 65px !important;
}
.mb70 {
  margin-bottom: 70px !important;
}
.mb75 {
  margin-bottom: 75px !important;
}
.mb80 {
  margin-bottom: 80px !important;
}
.mb85 {
  margin-bottom: 85px !important;
}
.mb90 {
  margin-bottom: 90px !important;
}
.mb95 {
  margin-bottom: 95px !important;
}
.mb100 {
  margin-bottom: 100px !important;
}
.ml0 {
  margin-left: 0 !important;
}
.ml5 {
  margin-left: 5px !important;
}
.ml10 {
  margin-left: 10px !important;
}
.ml15 {
  margin-left: 15px !important;
}
.ml20 {
  margin-left: 20px !important;
}
.ml25 {
  margin-left: 25px !important;
}
.ml30 {
  margin-left: 30px !important;
}
.ml35 {
  margin-left: 35px !important;
}
.ml40 {
  margin-left: 40px !important;
}
.ml45 {
  margin-left: 45px !important;
}
.ml50 {
  margin-left: 50px !important;
}
.ml55 {
  margin-left: 55px !important;
}
.ml60 {
  margin-left: 60px !important;
}
.ml65 {
  margin-left: 65px !important;
}
.ml70 {
  margin-left: 70px !important;
}
.ml75 {
  margin-left: 75px !important;
}
.ml80 {
  margin-left: 80px !important;
}
.ml85 {
  margin-left: 85px !important;
}
.ml90 {
  margin-left: 90px !important;
}
.ml95 {
  margin-left: 95px !important;
}
.ml100 {
  margin-left: 100px !important;
}

.pt0 {
  padding-top: 0 !important;
}
.pt5 {
  padding-top: 5px !important;
}
.pt10 {
  padding-top: 10px !important;
}
.pt15 {
  padding-top: 15px !important;
}
.pt20 {
  padding-top: 20px !important;
}
.pt25 {
  padding-top: 25px !important;
}
.pt30 {
  padding-top: 30px !important;
}
.pt35 {
  padding-top: 35px !important;
}
.pt40 {
  padding-top: 40px !important;
}
.pt45 {
  padding-top: 45px !important;
}
.pt50 {
  padding-top: 50px !important;
}
.pt55 {
  padding-top: 55px !important;
}
.pt60 {
  padding-top: 60px !important;
}
.pt65 {
  padding-top: 65px !important;
}
.pt70 {
  padding-top: 70px !important;
}
.pt75 {
  padding-top: 75px !important;
}
.pt80 {
  padding-top: 80px !important;
}
.pt85 {
  padding-top: 85px !important;
}
.pt90 {
  padding-top: 90px !important;
}
.pt95 {
  padding-top: 95px !important;
}
.pt100 {
  padding-top: 100px !important;
}
.pr0 {
  padding-right: 0 !important;
}
.pr5 {
  padding-right: 5px !important;
}
.pr10 {
  padding-right: 10px !important;
}
.pr15 {
  padding-right: 15px !important;
}
.pr20 {
  padding-right: 20px !important;
}
.pr25 {
  padding-right: 25px !important;
}
.pr30 {
  padding-right: 30px !important;
}
.pr35 {
  padding-right: 35px !important;
}
.pr40 {
  padding-right: 40px !important;
}
.pr45 {
  padding-right: 45px !important;
}
.pr50 {
  padding-right: 50px !important;
}
.pr55 {
  padding-right: 55px !important;
}
.pr60 {
  padding-right: 60px !important;
}
.pr65 {
  padding-right: 65px !important;
}
.pr70 {
  padding-right: 70px !important;
}
.pr75 {
  padding-right: 75px !important;
}
.pr80 {
  padding-right: 80px !important;
}
.pr85 {
  padding-right: 85px !important;
}
.pr90 {
  padding-right: 90px !important;
}
.pr95 {
  padding-right: 95px !important;
}
.pr100 {
  padding-right: 100px !important;
}
.pb0 {
  padding-bottom: 0 !important;
}
.pb5 {
  padding-bottom: 5px !important;
}
.pb10 {
  padding-bottom: 10px !important;
}
.pb15 {
  padding-bottom: 15px !important;
}
.pb20 {
  padding-bottom: 20px !important;
}
.pb25 {
  padding-bottom: 25px !important;
}
.pb30 {
  padding-bottom: 30px !important;
}
.pb35 {
  padding-bottom: 35px !important;
}
.pb40 {
  padding-bottom: 40px !important;
}
.pb45 {
  padding-bottom: 45px !important;
}
.pb50 {
  padding-bottom: 50px !important;
}
.pb55 {
  padding-bottom: 55px !important;
}
.pb60 {
  padding-bottom: 60px !important;
}
.pb65 {
  padding-bottom: 65px !important;
}
.pb70 {
  padding-bottom: 70px !important;
}
.pb75 {
  padding-bottom: 75px !important;
}
.pb80 {
  padding-bottom: 80px !important;
}
.pb85 {
  padding-bottom: 85px !important;
}
.pb90 {
  padding-bottom: 90px !important;
}
.pb95 {
  padding-bottom: 95px !important;
}
.pb100 {
  padding-bottom: 100px !important;
}
.pl0 {
  padding-left: 0 !important;
}
.pl5 {
  padding-left: 5px !important;
}
.pl10 {
  padding-left: 10px !important;
}
.pl15 {
  padding-left: 15px !important;
}
.pl20 {
  padding-left: 20px !important;
}
.pl25 {
  padding-left: 25px !important;
}
.pl30 {
  padding-left: 30px !important;
}
.pl35 {
  padding-left: 35px !important;
}
.pl40 {
  padding-left: 40px !important;
}
.pl45 {
  padding-left: 45px !important;
}
.pl50 {
  padding-left: 50px !important;
}
.pl55 {
  padding-left: 55px !important;
}
.pl60 {
  padding-left: 60px !important;
}
.pl65 {
  padding-left: 65px !important;
}
.pl70 {
  padding-left: 70px !important;
}
.pl75 {
  padding-left: 75px !important;
}
.pl80 {
  padding-left: 80px !important;
}
.pl85 {
  padding-left: 85px !important;
}
.pl90 {
  padding-left: 90px !important;
}
.pl95 {
  padding-left: 95px !important;
}
.pl100 {
  padding-left: 100px !important;
}

.wide10 {
  width: 10% !important;
}
.wide15 {
  width: 15% !important;
}
.wide20 {
  width: 20% !important;
}
.wide25 {
  width: 25% !important;
}
.wide30 {
  width: 30% !important;
}
.wide35 {
  width: 35% !important;
}
.wide40 {
  width: 40% !important;
}
.wide45 {
  width: 45% !important;
}
.wide50 {
  width: 50% !important;
}
.wide55 {
  width: 55% !important;
}
.wide60 {
  width: 60% !important;
}
.wide65 {
  width: 65% !important;
}
.wide70 {
  width: 70% !important;
}
.wide75 {
  width: 75% !important;
}
.wide80 {
  width: 80% !important;
}
.wide85 {
  width: 85% !important;
}
.wide90 {
  width: 90% !important;
}
.wide95 {
  width: 95% !important;
}
.wide100 {
  width: 100% !important;
}

#contactForm .step10 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

#contactForm .step15 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 15px;
  padding-bottom: 15px;
}

#contactForm .step20 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 20px;
  padding-bottom: 20px;
}

#contactForm .step25 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 25px;
  padding-bottom: 25px;
}

#contactForm .step30 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 30px;
  padding-bottom: 30px;
}

#contactForm .step35 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 35px;
  padding-bottom: 35px;
}

#contactForm .step40 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 40px;
  padding-bottom: 40px;
}

#contactForm .step45 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 45px;
  padding-bottom: 45px;
}

#contactForm .step50 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 50px;
  padding-bottom: 50px;
}

@media (max-width: 767px) {
  .wide .wide10,
  .wide .wide15,
  .wide .wide20,
  .wide .wide25,
  .wide .wide30,
  .wide .wide35,
  .wide .wide40,
  .wide .wide45,
  .wide .wide50,
  .wide .wide55,
  .wide .wide60,
  .wide .wide65,
  .wide .wide70,
  .wide .wide75,
  .wide .wide80,
  .wide .wide85,
  .wide .wide90,
  .wide .wide95 {
    width: 100% !important;
  }
  .w20 {
    margin: auto;
    width: 20% !important;
  }
  .w25 {
    margin: auto;
    width: 25% !important;
  }
  .w30 {
    margin: auto;
    width: 30% !important;
  }
  .w35 {
    margin: auto;
    width: 35% !important;
  }
  .w40 {
    margin: auto;
    width: 40% !important;
  }
  .w45 {
    margin: auto;
    width: 45% !important;
  }
  .w50 {
    margin: auto;
    width: 50% !important;
  }
  .w55 {
    margin: auto;
    width: 55% !important;
  }
  .w60 {
    margin: auto;
    width: 60% !important;
  }
  .w65 {
    margin: auto;
    width: 65% !important;
  }
  .w70 {
    margin: auto;
    width: 70% !important;
  }
  .w75 {
    margin: auto;
    width: 75% !important;
  }
  .w80 {
    margin: auto;
    width: 80% !important;
  }
  .w85 {
    margin: auto;
    width: 85% !important;
  }
  .w90 {
    margin: auto;
    width: 90% !important;
  }
  .w95 {
    margin: auto;
    width: 95% !important;
  }
}

/*#########################################################*\

$float

\*#########################################################*/

.pctL {
  float: left;
  margin-bottom: 15px;
  margin-right: 50px !important;
}

.pctR {
  float: right;
  margin-bottom: 15px ;
  margin-left: 50px !important;
}

@media (max-width: 767px) {
  .pctL {
    float: none;
    margin: 0 0 10px 0 !important;
  }

  .pctR {
    float: none;
    margin: 0 0 10px 0 !important;
  }
  .pctL.no {
    float: left;
    margin: 0 10px 10px 0 !important;
    width: 20%;
  }

  .pctR.no {
    float: right;
    margin: 0 0 10px 10px !important;
    width: 20%;
  }
}

.cl {
  clear: both;
}


/*#########################################################*\

$clearfix

\*#########################################################*/

.clearfix:after {
  clear: both;
  content: " ";
  display: block;
  font-size: .1em;
  height: 0;
  line-height: 0;
  overflow: hidden;
  visibility: hidden;
}

.clearfix {
  display: inline-block;
}

/* Holly Hack Targets IE Win only \*/
* html .clearfix {
  height: 1%;
}

.clearfix {
  display: block;
}
/* End Holly Hack */


/*#########################################################*\

$text-align

\*#########################################################*/

.aLeft {
  text-align: left !important;
}

.aRight {
  text-align: right !important;
}

.aCenter {
  text-align: center !important;
}


/*#########################################################*\

$position

\*#########################################################*/

.centered {
  left: 50%;
  margin: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%) translateX(-50%);
}

/*#########################################################*\

$レスポンシブ系

\*#########################################################*/

.sp {
  display: none;
}

@media (max-width: 767px) {
  .pc,
  .tb {
    display: none !important;
  }

  .sp {
    display: block !important;
  }

  img {
    max-width: 100%;
  }

  .wide {
    height: auto;
    width: 100% !important;
  }

  .responsiveBox {
    height: 0;
    margin-top: 20px;
    overflow: hidden;
    padding-bottom: 56.25%;
    padding-top: 30px;
    position: relative;
  }

  .responsiveBox iframe,
  .responsiveBox object,
  .responsiveBox embed {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }
}

/*#########################################################*\

$テキスト系

\*#########################################################*/
#Co p {
  font-size: 1em;
  margin-bottom: 30px;
}

#Co .catch {
  font-size: 1.125em;
  font-weight: 700;
}

#Co .ss {
  font-size: .875em;
}

#Co .err,
#Co .error,
#Co .mailerr,
#Co .mail_chkerr {
  color: #ff0000;
  font-size: .875em;
}

#Co p:not(:last-child),
#Co ul:not(:last-child) {
  margin-bottom: 30px;
}

#Co li:not(:last-child) {
  margin-bottom: 10px;
}

strong {
  font-weight: 700;
}

.pointTxt {
  color: #3fa037;
  font-weight: 700;
}


.pointTxt_Ud {
  font-weight: 700;
  text-decoration: underline;
}

sup,
sub {
  font-size: .688em !important;
}

.nw {
  white-space: nowrap !important;
}


@media (max-width: 767px) {
  #Co p {
    font-size: .875em;
  }

  #Co .catch {
    font-size: 1em;
    font-weight: 700;
  }

  #Co .ss {
    font-size: .813em;
  }

  #Co .err,
  #Co .error,
  #Co .mailerr,
  #Co .mail_chkerr {
    font-size: .875em;
  }
}



/*#########################################################*\

$蛍光ペン

\*#########################################################*/

.pen {
  background: linear-gradient(transparent 80%, #ffe001 60%);
  font-weight: 700;
}

.pen_p {
  background: linear-gradient(transparent 80%, #ff66cc 60%);
  font-weight: 700;
}

.pen_b {
  background: linear-gradient(transparent 80%, #66ccff 60%);
  font-weight: 700;
}

.pen_g {
  background: linear-gradient(transparent 80%, #66ff66 60%);
  font-weight: 700;
}



/*#########################################################*\

$dot

\*#########################################################*/

.dot {
  color: #ec620c;
  padding-top: .2em;
  position: relative;
}

.dot::before {
  background-color: #ec620c;
  border-radius: 50%;
  content: "";
  height: .2em;
  left: 50%;
  position: absolute;
  top: 0;
  transform: translate(-50%, 0);
  width: .2em;
}



/*#########################################################*\

$section

\*#########################################################*/

.section_bg {
  background-color: #f5f5f5;
}


/*#########################################################*\

$btn

\*#########################################################*/

#Co .btn {
  margin: 0 auto 30px auto;
  width: 300px;
}

#Co .btngroup ul li::before {
  content: none;
}

#Co .btngroup ul li {
  padding-left: 0;
  text-indent: 0;
}

#Co .btn a,
#Co .btngroup ul li a {
  align-items: center;
  background: #3fa037;
  border: 2px solid #ffffff;
  border-radius: 100px;
  color: #ffffff;
  cursor: pointer;
  display: flex;
  font-size: 1em;
  font-weight: 500;
  justify-content: center;
  line-height: 1;
  margin: 0 auto;
  padding: 15px 10px;
  position: relative;
  text-align: center;
  text-decoration: none;
  width: 100%;
}

#Co .btn a:hover,
#Co .btngroup ul li a:hover {
  background: #ffffff;
  border: 2px solid #3fa037;
  color: #3fa037;
  opacity: 1;
}

#Co .btn a:after,
#Co .btngroup ul li a:after {
  border-right: solid 2px #ffffff;
  border-top: solid 2px #ffffff;
  content: "";
  height: 8px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: .3s;
  width: 8px;
}

#Co .btn a:hover:after,
#Co .btngroup ul li a:hover:after {
  border-right: solid 2px #3fa037;
  border-top: solid 2px #3fa037;
  content: "";
  height: 8px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: .3s;
  width: 8px;
}

#Co .btn a.blank:after,
#Co .btngroup ul li a.blank:after {
  background: url(../images/ico_blank_b.svg) no-repeat center right;
  border: none;
  display: inline-block;
  height: 1.6em;
  position: absolute;
  right: 10px;
  top: auto;
  transform: none;
  vertical-align: middle;
  width: 1.6em;
}

#Co .btn a.blank:hover:after,
#Co .btngroup ul li a.blank:hover:after {
  background: url(../images/ico_blank_g.svg) no-repeat center right;
  border: none;
  display: inline-block;
  height: 1.6em;
  position: absolute;
  right: 10px;
  top: auto;
  transform: none;
  vertical-align: middle;
  width: 1.6em;
}

#Co .btn a[href$=".pdf"],
#Co .btngroup ul li a[href$=".pdf"] {
  background: url(../images/ico_pdf.svg) no-repeat 96% center #3fa037;
  background-size: 22px 23px;
  content: "";
  margin: 0;
  text-indent: -1em;
}

#Co .btn a[href$=".pdf"]:hover,
#Co .btngroup ul li a[href$=".pdf"]:hover {
  background: url(../images/ico_pdf.svg) no-repeat 96% center #ffffff;
  background-size: 22px 23px;
  color: #3fa037;
}

#Co .btn a[href$=".pdf"]:after,
#Co .btngroup ul li a[href$=".pdf"]:after {
  content: none;
}

#Co .btngroup ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  position: relative;
  position: relative;
  width: 100%;
}

#Co .btngroup ul li {
  margin-bottom: 20px;
  width: 48%;
}

#Co .btngroup ul li:last-child {
  margin-bottom: 20px !important;
}

@media only screen and (max-width: 767px) {
  #Co .btn,
  #Co .btngroup ul li {
    width: 80%;
  }

  #Co .btngroup ul li {
    margin-left: auto;
    margin-right: auto;
  }

  #Co .btn a,
  #Co .btngroup ul li a {
    font-size: .875em;
    padding: 15px 5px;
  }

  #Co .btngroup ul {
    display: block;
  }

  #Co .btngroup ul li:first-child {
    margin-bottom: 10px;
  }
}


/*#########################################################*\

$pan

\*#########################################################*/

#pan {
  background: #f1f1f1;
  margin-bottom: 50px;
  width: 100%;
}

#pan ul {
  font-size: .750em;
  margin: 0 auto;
  padding: 10px 0 0 15px;
  text-align: left;
  width: 1100px;
}

#pan ul li {
  display: inline-block;
  font-weight: 400;
  margin-right: 5px;
}

#pan ul li:after {
  content: ">";
  margin-left: 7px;
}

#pan ul li:last-child:after {
  content: none;
  margin-left: 0;
}

#pan ul li a {
  color: #3fa037;
}

#pan ul li a:hover {
  color: #000000;
}

@media only screen and (max-width: 767px) {
  #pan {
    margin-bottom: 30px;
  }

  #pan ul {
    padding: 5px 0 0 15px;
    width: 100%;
  }

  #pan ul li {
    margin-bottom: 5px !important;
  }
}



/*#########################################################*\

$右寄せ矢印

\*#########################################################*/

.arrow_r {
  display: block;
  padding: 0 24px 0 0;
  position: relative;
  text-align: right;
  text-decoration: none;
}

.arrow_r::before,
.arrow_r::after {
  bottom: 0;
  content: "";
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  vertical-align: middle;
}

.arrow_r::before {
  background: #3fa037;
  -webkit-border-radius: 50%;
          border-radius: 50%;
  height: 16px;
  width: 16px;
}

.arrow_r::after {
  border-right: 2px solid #ffffff;
  border-top: 2px solid #ffffff;
  height: 6px;
  right: 6px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  width: 6px;
}


/*#########################################################*\

$Flex

\*#########################################################*/

.flexBox {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 30px 0;
  position: relative;
  width: 100%;
}

.flexBox .flexBoxInner_91:first-child {
  width: 10%;
}

.flexBox .flexBoxInner_82:first-child {
  width: 20%;
}

.flexBox .flexBoxInner_73:first-child {
  width: 30%;
}

.flexBox .flexBoxInner_64:first-child {
  width: 40%;
}

.flexBox .flexBoxInner_91:last-child {
  margin-left: 5%;
  width: 85%;
}

.flexBox .flexBoxInner_82:last-child {
  margin-left: 5%;
  width: 75%;
}

.flexBox .flexBoxInner_73:last-child {
  margin-left: 5%;
  width: 65%;
}

.flexBox .flexBoxInner_64:last-child {
  margin-left: 5%;
  width: 55%;
}

.box02,
.box03,
.box04,
.box05,
.box06 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 0 30px 0;
  position: relative;
  width: 100%;
}

.flex-start {
  display: flex;
  justify-content: start;
}

.flex-end {
  justify-content: flex-end;
}

.flex-space-around {
  justify-content: space-around;
}

.flex-center {
  align-items: center;
  justify-content: center;
  text-align: center;
}

.reverse {
  flex-flow: row-reverse;
}

.box02::after {
  content: "";
  display: block;
  width: 48.5%;
}

.box02.reverse::after {
  content: none;
}

.box03::after {
  content: "";
  display: block;
  width: 32%;
}

.box04::before {
  content: "";
  display: block;
  order: 1;
  width: 23.5%;
}

.box04::after {
  content: "";
  display: block;
  width: 23.5%;
}

.box02 li,
.box02 .box02Inner {
  flex-shrink: 0;
  max-width: 100%;
  width: 48.5%;
}

.box03 li,
.box03 .box03Inner {
  flex-shrink: 0;
  max-width: 100%;
  width: 32%;
}

.box04 li,
.box04 .box04Inner {
  flex-shrink: 0;
  max-width: 100%;
  width: 23.5%;
}

.box05 li,
.box05 .box05Inner {
  flex-shrink: 0;
  max-width: 100%;
  width: 18%;
}

.box02 .wide li,
.box03 .wide li,
.box04 .wide li {
  flex-shrink: 0;
  max-width: 100% !important;
  width: 100% !important;
}

.box02.flex-start li,
.box02.flex-start .box02Inner {
  width: auto !important;
}

.box02.box05.flex-start li:first-child,
.box05.flex-start .box02Inner:first-child {
  margin-right: 30px;
}

@media (max-width: 767px) {
  .box02,
  .box03,
  .box04,
  .box05 {
    display: block;
    margin: 0 0 20px 0;
    width: 100%;
  }

  .box02.no,
  .box03.no,
  .box04.no,
  .box05.no {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 0 20px 0;
    position: relative;
    width: 100%;
  }

  .box02.half,
  .box03.half,
  .box04.half,
  .box05.half {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0;
    position: relative;
    width: 100%;
  }

  .box02 li,
  .box03 li,
  .box04 li,
  .box05 li,
  .box02 .box02Inner,
  .box03 .box03Inner,
  .box04 .box04Inner,
  .box05 .box05Inner {
    margin-bottom: 30px;
    width: 100%;
  }

  .box03.no li {
    flex-shrink: 0;
    max-width: 100%;
    width: 31.5%;
  }

  .box02.half li,
  .box03.half li,
  .box04.half li,
  .box05.half li,
  .box02.half .box02Inner,
  .box03.half .box03Inner,
  .box04.half .box04Inner,
  .box05.half .box05Inner {
    flex-shrink: 0;
    max-width: 100%;
    width: 48%;
  }

  .box02.flex-start li:first-child,
  .box02.flex-start .box02Inner:first-child {
    margin-right: 0;
  }
}


/*#########################################################*\

$anchorBox

\*#########################################################*/

#anchorBox ul,
#anchorBox_02 ul,
#anchorBox_03 ul {
  margin: 0 auto 30px auto;
  position: relative;
  width: 100%;
}

#anchorBox ul li,
#anchorBox_02 ul li,
#anchorBox_03 ul li {
  display: flex;
  flex-direction: column;
}

#Co #anchorBox ul li,
#Co #anchorBox_02 ul li,
#Co #anchorBox_03 ul li:last-child {
  margin-bottom: 10px !important;
}

#anchorBox ul li a,
#anchorBox_02 ul li a,
#anchorBox_03 ul li a {
  background: rgba(63,160,55,.05);
  border: 1px solid #3fa037;
  color: #3fa037;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  font-size: .875em;
  font-weight: 700;
  justify-content: center;
  padding: 20px 20px 30px 20px;
  position: relative;
  text-align: center;
  text-decoration: none;
}

#anchorBox ul li a {
  font-size: .938em;
}

#anchorBox ul li a:hover,
#anchorBox_02 ul li a:hover,
#anchorBox_03 ul li a:hover {
  background: #3fa037;
  color: #ffffff;
  opacity: 1;
}

#anchorBox ul li a:after {
  border-bottom: 4px solid #3fa037;
  border-right: 4px solid #3fa037;
  bottom: 2em;
  content: "";
  height: 18px;
  left: calc( 50% - 9px );
  position: absolute;
  transform: rotate(45deg);
  width: 18px;
  zoom: 60%;
}

#anchorBox ul li a:hover:after {
  border-bottom: 4px solid #ffffff;
  border-right: 4px solid #ffffff;
  bottom: 1em;
}

@media screen and (max-width: 767px) {
  #anchorBox ul {
    margin: 0 auto 30px auto;
    width: 100%;
  }

  #anchorBox ul li,
  #anchorBox_02 ul li,
  #anchorBox_03 ul li {
    margin-bottom: 10px;
    width: 48.5% !important;
  }

  #anchorBox ul li a {
    padding: 10px 20px;
  }

  #anchorBox ul li a::before {
    border-right: solid 2px #3fa037;
    border-top: solid 2px #3fa037;
    content: "";
    height: 8px;
    left: auto;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg) !important;
    width: 8px;
    zoom: 100%;
  }

  #anchorBox ul li a:after,
  #anchorBox ul li a:hover:after {
    content: none;
  }
}


/*#########################################################*\

$anchorBox_02,#anchorBox_03

\*#########################################################*/

#anchorBox_02 ul,
#anchorBox_03 ul {
  margin: 0 auto 20px auto;
}

#anchorBox_02 ul li a,
#anchorBox_03 ul li a {
  font-weight: 400;
  padding: 15px 20px;
  position: relative;
}

#anchorBox_02 ul li a:after,
#anchorBox_03 ul li a:after {
  border-right: solid 2px #3fa037;
  border-top: solid 2px #3fa037;
  content: "";
  height: 8px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: .3s;
  width: 8px;
}

#anchorBox_02 ul li a:hover:after,
#anchorBox_03 ul li a:hover:after {
  border-right: solid 2px #ffffff;
  border-top: solid 2px #ffffff;
  content: "";
  height: 8px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: .3s;
  width: 8px;
}

#anchorBox_03 ul li a {
  background: transparent;
  padding: 10px;
}

@media screen and (max-width: 767px) {
  #anchorBox_02 ul li a,
  #anchorBox_03 ul li a {
    padding: 5px 20px 5px 10px;
  }
}


/*#########################################################*\

$colorBox_g

\*#########################################################*/

.page .colorBox_g,
.page .colorBox_02 {
  background: #f6f6f8;
  margin-bottom: 30px;
  padding: 20px;
}

.page .colorBox_g .colorBoxInner {
  background: #ffffff;
  margin-top: 20px;
  padding: 20px;
}

.page .colorBox_g .colorBoxInner h4 {
  border-bottom: 1px solid #3fa037;
  color: #3fa037;
  font-size: 1.188em;
  margin-bottom: 25px;
  padding: 0 0 15px 0;
}

.page .colorBox_g .colorBoxInner h4:before {
  content: none;
}

.page .colorBox_g .colorBoxInner:first-child {
  margin-top: 0;
}

.colorBox_g ul:last-child,
.colorBox_g li:last-child,
.colorBox_g p:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .colorBox_g {
    padding: 20px;
  }

  .page .colorBox_g .colorBoxInner h4 {
    font-size: 1em;
    margin-bottom: 20px;
    padding: 0 0 10px 0;
  }
}


/*#########################################################*\

$colorBox_02

\*#########################################################*/

.page .colorBox_02 {
  background: rgba(63,160,55,.1);
}


/*#########################################################*\

$borderBox

\*#########################################################*/

.borderBox {
  border: 1px solid #3fa037;
  line-height: 1.4;
  margin-bottom: 30px;
  padding: 30px;
}

.page .borderBox .borderBoxInner {
  margin-top: 20px;
}

.page .borderBox .borderBoxInner:first-child {
  margin-top: 0;
}

.page .borderBox h4 {
  border-bottom: 1px solid #3fa037;
  color: #3fa037;
  font-size: 1.188em;
  margin-bottom: 25px;
  padding: 0 0 15px 0;
}

.page .borderBox h4:before {
  content: none;
}

.borderBox ul:last-child,
.borderBox li:last-child,
.borderBox p:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .borderBox {
    margin-bottom: 0;
    padding: 20px;
  }

  .page .borderBox h4 {
    font-size: 1em;
    margin-bottom: 20px;
    padding: 0 0 10px 0;
  }
}


/*#########################################################*\

$ピン付き（4つ角）

\*#########################################################*/

.pinBox {
  background-color: #f5f5f5;
  padding: 1.5em;
}

.pinBox .pinBoxInner {
  padding: 1.5em;
}

#Co .page .pinBox .pinBoxInner h4 {
  margin-top: 0 !important;
}

.pinBox ul:last-child,
.pinBox li:last-child,
.pinBox p:last-child {
  margin-bottom: 0 !important;
}

.pin_top,
.pin_bottom {
  position: relative;
}

.pin_top::before {
  background-color: #ffffff;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
  content: "";
  height: 8px;
  left: -6px;
  position: absolute;
  top: -6px;
  width: 8px;
}

.pin_top::after {
  background-color: #ffffff;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
  content: "";
  height: 8px;
  position: absolute;
  right: -6px;
  top: -6px;
  width: 8px;
}

.pin_bottom::before {
  background-color: #ffffff;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
  bottom: -6px;
  content: "";
  height: 8px;
  left: -6px;
  position: absolute;
  width: 8px;
}
.pin_bottom::after {
  background-color: #ffffff;
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
  bottom: -6px;
  content: "";
  height: 8px;
  position: absolute;
  right: -6px;
  width: 8px;
}

@media (max-width: 767px) {
  .pinBox .box02Inner {
    background-color: #f5f5f5;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.5em;
  }

  .pinBox .box02Inner .pinBoxInner {
    padding: .5em;
  }
}


/*#########################################################*\

$notesBox

\*#########################################################*/

.notesBox p {
  background-color: #ffffff;
  background-image: linear-gradient(90deg, transparent 0%, transparent 50%, #ffffff 50%, #ffffff 100%), /* 点線1の色 */ linear-gradient(180deg, #cccccc 1px, transparent 1px);
  background-size: 8px 100%, /* 点線1のサイズ */ 100% 3em;
  line-height: 3em;
  margin-bottom: 30px;
  padding-bottom: 1px;
}


/*#########################################################*\

$flowBox

\*#########################################################*/

.flowBox {
  padding: 0 0 0 90px;
  position: relative;
  z-index: 10;
}

.flowBox:after {
  background: #f4f4f4;
  content: "";
  display: block;
  height: 78%;
  left: 25px;
  position: absolute;
  top: 1px;
  width: 6px;
}

.flowBox .flowBoxInner {
  border-bottom: 1px dashed #cccccc;
  margin: 40px 0 0 0;
  padding: 0 0 20px 0;
  position: relative;
}

.flowBox h4 {
  background: none;
  border-bottom: none;
  clear: both;
  line-height: 1.6em;
  margin: 30px 0 10px 0;
  padding: 5px 0 0 0;
  position: relative;
}

.flowBox .box {
  position: relative;
}

.flowBox .box .step {
  background: #000000;
  border-radius: 200px;
  color: #ffffff;
  font-size: 1.5em !important;
  height: 56px;
  left: -91px;
  line-height: 56px;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: center;
  top: 0;
  width: 56px;
  z-index: 11;
}

.flowBox h4 {
  border: none !important;
  padding: 0 !important;
}


/*#########################################################*\

$contactBox

\*#########################################################*/

#Co .contactBox {
  align-items: stretch;
  display: flex;
  margin: 0 auto;
}

#Co .contactBox .contactBoxInner {
  align-items: stretch;
  border: 2px	solid rgba(233,69,0,1);
  box-sizing: border-box;
  display: flex;
  margin-right: 2%;
  margin-top: 30px;
  padding: 40px 0;
  text-align: center;
  -webkit-transition-duration: .3s;
          transition-duration: .3s;
  width: 40%;
}

#Co .contactBox .contactBoxInner:last-child {
  border: 2px	solid rgba(240,131,0,1);
  margin-left: 2%;
  margin-right: 0;
  padding: 40px 0 50px;
}

#Co .contactBox .contactBoxInner:hover {
  background: rgba(233,69,0,1);
  -webkit-transition-duration: .3s;
          transition-duration: .3s;
}

#Co .contactBox .contactBoxInner:last-child:hover {
  background: rgba(240,131,0,1);
  color: #ffffff;
}

#Co .contactBox .contactBoxInner a {
  align-items: center;
  display: flex;
  font-size: 1.250em;
  justify-content: center;
  margin: 0 auto;
  text-decoration: none;
}

#Co .contactBox .contactBoxInner a p {
  color: rgba(233,69,0,1);
  font-size: 1.250em;
  font-weight: 700;
  line-height: 2.4;
  margin-bottom: 0;
  text-align: left;
}

#Co .contactBox .contactBoxInner a p:before {
  background-image: url(../images/ico_mail.png);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 22px;
  margin-right: 20px;
  vertical-align: middle;
  width: 30px;
}

#Co .contactBox .contactBoxInner:hover a p:before {
  background-image: url(../images/ico_mail_on.png);
}

#Co .contactBox .contactBoxInner a p .ss {
  font-size: .875em;
}

#Co .contactBox .contactBoxInner:last-child a p {
  color: rgba(240,131,0,1);
  font-family: "Josefin Sans", sans-serif;
  font-size: 1.875em;
  font-weight: 600;
  margin-left: 60px;
  position: relative;
}

#Co .contactBox .contactBoxInner:last-child a p:before {
  background-image: url(../images/ico_tel.png);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 39px;
  left: -40px;
  position: absolute;
  top: 25%;
  vertical-align: middle;
  width: 24px;
}

#Co .contactBox .contactBoxInner:last-child:hover a p:before {
  background-image: url(../images/ico_tel_on.png);
}

#Co .contactBox .contactBoxInner:hover p {
  color: #ffffff !important;
}

@media (max-width: 767px) {
  #Co .contactBox {
    display: block;
  }

  #Co .contactBox .contactBoxInner {
    margin-right: 0;
    margin-top: 30px;
    padding: 20px 0;
    width: 100%;
  }

  #Co .contactBox .contactBoxInner:last-child {
    margin-left: 0;
    margin-right: 0;
    padding: 10px 0 15px;
  }

  #Co .contactBox .contactBoxInner a p {
    font-size: 1em !important;
  }

  #Co .contactBox .contactBoxInner a p .ss {
    font-size: .875em;
  }

  #Co .contactBox .contactBoxInner:last-child a p {
    font-size: 1.625em !important;
    margin-left: 40px;
  }

  #Co .contactBox .contactBoxInner:last-child a p:before {
    left: -35px;
    top: 15%;
  }
}


/*#########################################################*\

$テーブル系

\*#########################################################*/

#Co table th,
#Co table td,
#detailPage table th,
#detailPage table td {
  font-size: .938em;
  line-height: 1.6;
  margin: 0;
}

#Co table td ul,
#Co table td ol {
  margin: 0 !important;
}

#Co table td ul.mb15 {
  margin: 0 0 15px 0 !important;
}

#Co table td ul.mb20,
#Co table td ol.mb20 {
  margin: 0 0 20px 0 !important;
}

#Co table td p {
  font-size: 1em;
}

#Co table td li {
  margin: 0 0 5px 0 !important;
}

#Co table td li:last-child {
  margin: 0 !important;
}

#Co table th .ss,
#Co table td .ss {
  font-size: .813em;
}

#Co table.tbl,
#Co table.tblBorder,
#detailPage table {
  margin: 0 0 30px 0;
  padding: 0;
  width: 100%;
}

#Co table.tbl tr.price td,
#Co table.tblBorder tr.price td {
  text-align: right;
}

#Co table.tblBorder th,
#Co table.tblBorder td {
  border-bottom: solid 1px rgba(0, 0, 0, .2);
  box-sizing: border-box;
  text-align: left;
  vertical-align: middle;
}

#Co table.tblBorder th {
  border-bottom: solid 1px #000000;
  padding-right: 20px;
  text-align: left;
  width: 25%;
}

#Co table.tblBorder.fix,
#Co table.tbl.fix {
  table-layout: fixed;
  width: 100%;
}

#Co table.tblBorder.fix th,
#Co table.tbl.fix th {
  width: auto;
}

#Co table.tbl.center th,
#Co table.tbl.center td {
  text-align: center !important;
}

#Co table.tbl.center th.no,
#Co table.tbl.center td.no {
  text-align: left !important;
}

#Co table.tbl th,
#Co table.tbl td,
#detailPage table th,
#detailPage table td,
#detailPage table th,
#detailPage table td {
  border: 1px solid #dfdfdf;
  padding: 1.5em 1.2em;
  text-align: left;
  vertical-align: middle;
}

#Co table.tbl th,
#detailPage table th {
  background: #f0f0f0;
  font-weight: bold;
  text-align: left;
  width: 25%;
}

#Co table.tbl th.second {
  background: rgba(0, 0, 0, .02);
}

#Co table.tbl th.thaad {
  background: rgba(0, 0, 0, .03);
}

#Co table.tbl.pattern02 th {
  background: rgba(63,160,55,.1);
}

#Co table.tbl.pattern03 th {
  background: rgba(244,67,54,.1);
}


#Co table.tbl th .ss,
#detailPage table th .ss,
#Co table.tbl td .ss,
#detailPage table td .ss {
  color: #909090;
  font-weight: 400;
}

#Co table td .head {
  display: inline-block;
  margin-bottom: 5px;
  width: 1.563em;
}

/* 縦スクロール時に固定する */
.sticky_table_y {
  height: 300px;
  overflow: auto;
}

.sticky_table_y table {
  border-collapse: collapse;
}

.sticky_table_y th {
  position: sticky !important;
  position: relative;
  top: 0 !important;
  z-index: 1 !important;
}

/* 縦スクロール時に固定する */
.sticky_table_x {
  overflow: auto;
}

.sticky_table_x table {
  border-collapse: collapse !important;
  width: 1200px !important;
}

.sticky_table_x table th {
  left: 0 !important;
  position: sticky !important;
  position: relative;
  z-index: 1 !important;
}

@media (max-width: 767px) {
  #Co table.tblBorder {
    margin: 0 0 20px 0;
    padding: 0;
    width: 100%;
  }

  #Co table.tblBorder th,
  #Co table.tblBorder td {
    font-size: .875em;
  }

  #Co table.tblBorder th {
    border-bottom: solid 1px #000000;
    padding: 15px 15px 15px 0;
    padding-right: 0;
    width: 100% !important;
  }

  #Co table td .head {
    width: 1.375em;
  }

  #Co table td.short .head {
    width: 40%;
  }

  #contactForm tr th .hissu {
    margin-right: 10px;
  }

  #Co table.tbl,
  #detailPage table {
    border-top: 1px solid #dfdfdf;
  }

  #Co table.tbl th,
  #Co table.tbl td,
  #detailPage table th,
  #detailPage table td {
    font-size: .875em;
    padding: .8em;
  }

  #Co table td ul li,
  #Co table td ol li {
    font-size: 1em;
  }

  #Co table.tbl.wide th,
  #Co table.tbl.wide td,
  #detailPage.wide table th,
  #detailPage.wide table td {
    border-top: none;
    display: block;
    width: 100% !important;
  }

  .sticky_table_x table {
    border-collapse: collapse !important;
    width: 800px !important;
  }

  #Co .sticky_table_y table th,
  #Co .sticky_table_y table td,
  #Co .sticky_table_x table th,
  #Co .sticky_table_x table td {
    display: table-cell ;
    width: auto;
  }

  #Co .sticky_table_x table th {
    width: 150px;
  }
}


/*#########################################################*\

$scroll

\*#########################################################*/

@media (max-width: 767px) {
  .scroll {
    margin-bottom: 30px;
    overflow: auto;
    overflow-x: auto;
  }

  .scroll table {
    margin-bottom: 5px !important;
    max-width: none !important;
    width: 840px !important;
    zoom: 80%;
  }

  .scroll table.tbl th,
  .scroll table.tbl td {
    display: table-cell !important;
    width: auto !important;
  }

  .scroll::-webkit-scrollbar {
    height: 5px;
  }/*バーの太さ*/

  .scroll::-webkit-scrollbar-track {
    background: #dddddd;
  }/*バーの背景色*/

  .scroll::-webkit-scrollbar-thumb {
    background: #74c172;
  }/*バーの色*/
}



/*#########################################################*\

$リスト系

\*#########################################################*/

ul,
ol {
  margin-bottom: 30px;
}

ol {
  counter-reset: number;
  padding: 0 ;
}

ul li,
ol li {
  font-size: 1em;
  margin-bottom: 10px;
  padding: 0;
}

ul li:last-child,
ol li:last-child {
  margin-bottom: 0;
}

ol li {
  list-style: none;
  padding-left: 1.2em;
  position: relative;
  text-indent: 0;
}

ol li:before {
  content: counter(number)".";
  counter-increment: number;
  left: 0;
  position: absolute;
  top: 0;
}

/*三角矢印*/
.point li,
.point02 li,
.point03 li,
.point04 li,
.point05 li,
.point-dot li,
.reference li,
#detailPage ul li {
  padding-left: 1em;
  text-indent: -1em;
}

.asterisk li {
  padding-left: 1.4em;
  text-indent: -1.4em;
}

.point li::before,
#detailPage ul li::before {
  border-color: transparent transparent transparent #e6ac13;
  border-style: solid;
  border-width: 4.5px 0 4.5px 8px;
  content: "";
  display: inline-block;
  height: 0;
  margin-right: 8px;
  width: 0;
}

/*矢印*/
.point02 {
  list-style-type: none;
  padding: .5em;
}

.point02 li {
  padding: 0 .3em 0 1em;
  position: relative;
  text-indent: 0;
}

.point02 li::before,
.point02 li::after {
  content: "";
  display: inline-block;
  position: absolute;
}

.point02 li::after {
  border-bottom: 3px solid #e6ac13;
  border-radius: 25%;
  border-right: 3px solid #e6ac13;
  height: 9px;
  left: 0;
  top: 9.6px;
  transform: rotate(-45deg);
  width: 9px;
}

.point02 li::before {
  background-color: #e6ac13;
  border-radius: 25%;
  height: 3px;
  left: 0;
  top: 13px;
  width: 9px;
}

/*丸囲みリスト*/
.point03 {
  list-style-type: none;
}

.point03 li {
  padding: 0 .3em 0 1.4em;
  position: relative;
  text-indent: 0;
}

.point03 li::before,
.point03 li::after {
  content: "";
  display: inline-block;
  position: absolute;
}

.point03 li::after {
  background-color: #e6ac13;
  border-radius: 100%;
  height: 14px;
  left: 0;
  top: .6em;
  width: 14px;
}

.point03 li::before {
  border-bottom: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  height: 5px;
  left: .3em;
  top: .89em;
  transform: rotate(-45deg);
  width: 5px;
  z-index: 2;
}

.point04 li {
  padding: 0 0 0 1.4em;
  position: relative;
  text-indent: 0;
}

.point04 li::before {
  border: 0;
  border-right: solid 2.5px #e6ac13;
  border-top: solid 2.5px #e6ac13;
  content: "";
  height: 8px;
  left: 0;
  position: absolute;
  top: 42%;
  transform: rotate(45deg);
  width: 8px;
}

/*チェックリスト*/
.point05 {
  border: none;
  list-style-type: none;
  padding: .5em 0;
}

.point05 li {
  line-height: 1.5;
  padding-left: 15px;
  position: relative;
}

.point05 li:after {
  border-bottom: 3px solid #e6ac13;
  border-right: 3px solid #e6ac13;
  content: "";
  height: 10px;
  left: 0;
  position: absolute;
  top: .5em;
  transform: rotate(50deg);
  width: 5px;
}

/*ドット*/
.point-dot li {
  padding-left: 14px;
  position: relative;
  text-indent: 0;
}

.point-dot li:before {
  background: #e6ac13;
  border-radius: 50%;
  content: "";
  height: 5px;
  left: 0;
  position: absolute;
  top: .813em;
  width: 5px;
}

#Co .page .asterisk li:not(:last-child) {
  margin-bottom: 0;
}

#Co .page .asterisk li::before {
  content: "※";
  margin-right: 4px;
}

#Co .page .list li {
  margin: 0 0 20px 0;
}

#Co .page .list li a {
  border-bottom: 1px dashed #d3d3d3;
  display: block;
  font-size: .875em;
  padding: 0 0 10px 14px;
  position: relative;
  text-decoration: none;
  width: 100%;
}

#Co .page .list li a:before {
  background: #e6ac13;
  border-radius: 50%;
  content: "";
  height: 5px;
  left: 0;
  position: absolute;
  top: .813em;
  width: 5px;
}

#Co .reference li {
  margin-bottom: 0;
}

.ind {
  padding-left: 1em !important;
  text-indent: -1em !important;
}

@media only screen and (max-width: 767px) {
  ul li,
  ol li {
    font-size: .875em;
  }
}



/*#########################################################*\

$料金

\*#########################################################*/
.price {
  color: #d80000;
  font-family: "Josefin Sans", sans-serif;
  font-size: 1.125em;
  font-weight: 700;
  text-align: right;
}

.price_b {
  font-size: 2.250em;
}



/*#########################################################*\

$メニュー表

\*#########################################################*/

dl.program {
  font-size: 1em;
  width: 100%;
}
dl.program div {
  display: flex;
  justify-content: space-between;
  margin: 5px 0;
  padding: 5px 0;
  position: relative;
}
dl.program div::after {
  border-bottom: dotted 1px #000000;
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  width: 100%;
  z-index: 1;
}
dl.program dt {
  background-color: #ffffff;
  margin: 0;
  padding: 0 5px 0 0;
  text-align: left;
  z-index: 2;
}
dl.program dd {
  background-color: #ffffff;
  margin: 0;
  padding: 0 0 0 5px;
  text-align: right;
  z-index: 2;
}

@media only screen and (max-width: 767px) {
  dl.program {
    font-size: .875em;
    width: 100%;
  }
}


/*#########################################################*\

$ページネーション

\*#########################################################*/

ul.nation {
  clear: both;
  margin: 0;
  padding: 2em 0 0;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  ul.nation {
    padding: 1em 0 0;
  }
}

ul.nation li {
  background: #3fa037;
  color: #ffffff;
  display: inline;
  display: inline-block;
  line-height: 2.6em;
  margin: 0 8px;
  padding: 0;
  position: relative;
  text-align: center;
  width: 2.6em;
}

ul.nation li a {
  background: #f6f6f6;
  color: #666666;
  display: block;
  text-decoration: none;
  transition: all 1s;
  vertical-align: middle;
}

ul.nation li a:hover {
  background: #3fa037;
  color: #ffffff;
}

.colorB ul.nation li {
  border: 1px solid #ffffff;
  color: #ffff00;
}

.colorB ul.nation li a {
  color: #ffffff;
}

.colorY ul.nation li {
  border: 1px solid #000000;
  color: #000000;
}

.colorY ul.nation li a {
  color: #0000ff;
}

.colorB ul.nation li a,
.colorY ul.nation li a {
  text-decoration: underline;
}

.colorB ul.nation li,
.colorY ul.nation li,
.colorB ul.nation li a,
.colorY ul.nation li a,
.colorB ul.nation li:hover a,
colory ul.nation li:hover a {
  background: transparent;
}


/*#########################################################*\

$btnTop

\*#########################################################*/

#btnTop {
  background: rgba(63,160,55,.6);
  border-radius: 50%;
  bottom: 80px;
  height: 40px;
  position: fixed;
  right: 20px;
  width: 40px;
  z-index: 100;
}

#btnTop a {
  display: block;
  height: 40px;
  position: relative;
  text-decoration: none;
  width: 40px;
}

#btnTop a::before {
  border-left: 4px solid #ffffff;
  border-top: 4px solid #ffffff;
  bottom: 0;
  color: #ffffff;
  content: "";
  height: 10px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  text-align: center;
  top: 4px;
  transform: rotate(45deg);
  width: 10px;
}


/*#########################################################*\

$super_footer

\*#########################################################*/

#super_footer {
  border-top: .2em solid #ffffff;
  bottom: -150px;
  left: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  transition: .5s;
  width: 100%;
  z-index: 100;
}

#super_footer ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0;
  padding: 0;
}

#super_footer ul li {
  margin: 0;
  padding: 0;
  width: calc(100% / 3);
}

#super_footer li a {
  background: #0071bc;
  color: #ffffff;
  display: block;
  font-size: 1.250em;
  font-weight: 700;
  line-height: 1;
  padding: .720em;
  position: relative;
  text-align: center;
  text-decoration: none;
  width: 100%;
}

#super_footer li a strong {
  font-size: 1.500em;
}

#super_footer li a:hover {
  opacity: .8;
}

#super_footer li a:after {
  border-right: solid 3px #ffffff;
  border-top: solid 3px #ffffff;
  content: "";
  height: 12px;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  transition: .3s;
  width: 12px;
}

#super_footer li:nth-child(2) a {
  background: #8cc63f;
}

#super_footer li:nth-child(3) a {
  background: #009245;
}

#super_footer.show {
  bottom: 0;
}

@media only screen and (max-width: 767px) {
  #super_footer li a {
    font-size: .938em;
    line-height: 1.4;
    padding: 1em;
    text-align: left;
  }
  #super_footer li a strong {
    font-size: 1.200em;
  }

  #super_footer li a:after {
    border-right: solid 2px #ffffff;
    border-top: solid 2px #ffffff;
    content: "";
    height: 8px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    transition: .3s;
    width: 8px;
  }
}



/*#########################################################*\

$category

\*#########################################################*/

.category {
  background: #3fa037;
  border-radius: 4px;
  color: #ffffff;
  display: inline-block;
  font-size: .688em;
  line-height: 140%;
  margin: 0 10px;
  padding: 3px 0;
  text-align: center;
  width: 100px;
}

.category.category_02 {
  background: #00bcd7;
}

.category.category_03 {
  background: #ec6d74;
}

.category.important {
  background: #fe0000;
}


/*------------------------------------------------------------------------*\

$contact

\*------------------------------------------------------------------------*/

#Co p .hissu {
  background: #f44336;
  border-radius: 30px;
  color: #ffffff;
  display: inline-block;
  font-size: .688em;
  line-height: 1.6;
  margin-right: 5px;
  padding: 1px 15px;
}

#Co li .hissu {
  background: #f44336;
  border-radius: 30px;
  color: #ffffff;
  font-size: .75em;
  line-height: 1.6;
  margin-right: 5px;
  padding: 2px 15px;
}

#Co tr th .hissu {
  background: #f44336;
  border-radius: 30px;
  color: #ffffff;
  display: block;
  float: right;
  font-size: .625em;
  line-height: 1;
  margin-top: 5px;
  padding: 5px 15px;
  text-align: right;
}

#Co #contactForm tr th {
  width: 35%;
}

#contactForm td .title {
  display: block;
  margin-bottom: 10px;
  padding: 0 .3em 0 1.3em;
  position: relative;
}

#contactForm .step10 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

#contactForm .step15 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 15px;
  padding-bottom: 15px;
}

#contactForm .step20 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 20px;
  padding-bottom: 20px;
}

#contactForm .step25 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 25px;
  padding-bottom: 25px;
}

#contactForm .step30 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 30px;
  padding-bottom: 30px;
}

#contactForm .step35 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 35px;
  padding-bottom: 35px;
}

#contactForm .step40 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 40px;
  padding-bottom: 40px;
}

#contactForm .step45 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 45px;
  padding-bottom: 45px;
}

#contactForm .step50 {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 50px;
  padding-bottom: 50px;
}

#contactForm input[type="text"],
#contactForm input[type="email"],
#contactForm input[type="password"],
#contactForm textarea {
  background-color: #f6f6f6;
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  box-sizing: border-box;
  color: #3e3e3e;
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-size: 1em;
  font-weight: 400;
  padding: 10px 20px;
  width: 100%;
}

#btnCheck input[type=submit],
#btnSent input[type=submit],
#btnSent input[type=button] {
  background: #3fa037;
  border-radius: 100px;
  color: #ffffff;
  display: block;
  font-size: 1em;
  font-weight: 700;
  line-height: 1;
  margin: 0 auto;
  padding: 25px 40px;
  position: relative;
  text-align: center;
  text-decoration: none;
  width: 400px;
}

#btnSent input[type=button] {
  background: #cccccc !important;
  color: #ffffff;
}
#contactForm .select {
  background: white;
  color: #525259;
  display: inline-block;
  height: 40px;
  position: relative;
}

#contactForm .select:after {
  border-color: #ffffff transparent transparent transparent;
  border-style: solid;
  border-width: 5px 5px 0 5px;
  bottom: 0;
  content: "";
  height: 0;
  margin: auto;
  pointer-events: none;
  position: absolute;
  right: 10px;
  top: 0;
  width: 0;
  z-index: 10;
}

#contactForm .select:before {
  background: #3fa037;
  bottom: 1px;
  content: "";
  pointer-events: none;
  position: absolute;
  right: 1px;
  top: 1px;
  width: 30px;
  z-index: 2;
}

#contactForm .select select {
  -webkit-appearance: none;
     -moz-appearance: none;
  background: transparent;
  background: #f6f6f6;
  border: none;
  border: 1px solid #e5e5e5;
  border-radius: 0;
  box-shadow: none;
  color: #525259;
  cursor: pointer;
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-size: 1em;
  font-weight: 400;
  height: 100%;
  outline: none;
  padding-left: 15px;
  padding-right: 35px;
  width: 100%;
}

/*IE対応*/
#contactForm select::-ms-expand {
  display: none;
}

#contactForm #btnCheck {
  margin-top: 50px;
  text-align: center;
}

#contactForm #btnSent {
  margin-top: 50px;
}

#contactForm #btnSent ul {
  margin: 0 !important;
  text-align: center;
}

#contactForm #btnSent li {
  display: inline-block;
}

.error,
.mailerr,
.mail_chkerr {
  color: #ff0000;
  font-size: .875em;
}

@media only screen and (max-width: 767px) {
  .error,
  .mailerr,
  .mail_chkerr {
    color: #ff0000;
    font-size: .750em;
  }
  #contactForm input[type="text"],
  #contactForm input[type="email"],
  #contactForm input[type="password"],
  #contactForm textarea {
    font-size: .875em;
  }

  #btnCheck input[type=submit],
  #btnSent input[type=submit],
  #btnSent input[type=button] {
    font-size: .875em;
    margin: 0 auto;
    padding: 15px 0;
    width: 80%;
  }

  #contactForm .select select {
    font-size: .875em;
  }

  #contactForm #btnSent,
  #contactForm #btnCheck {
    margin-top: 0;
  }

  #contactForm #btnSent li {
    display: inline-block;
    width: 48.5%;
  }
}
