@charset "utf-8";

/*
----------------------*/
/*
----------------------------------------*/
/*全体の設定
---------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
  /*font-size:100%;*/
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,figure{
  margin: 0;
  padding: 0;
  font:inherit;
}
body {
  background-color: #f5f5f5;
  color: #333;
  font-size: 1.6rem;
  margin: 0 auto;
  padding: 0;
  font-family: 'Hiragino Kaku Gothic ProN',"ヒラギノ角ゴ Pro W3","游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic,Arial,Helvetica,Meiryo,'MS PGothic', Sans-serif;
  line-height: 1.75;
}
ul li{
  list-style: outside none none;
}
img {
  max-width: 100%;
  height: auto;
  border: none;
  vertical-align: bottom;
}
table {
  border-collapse:collapse;
  border-spacing: 0;
}
iframe{
  width: 100%;
}
address{
  font-style: normal;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
  text-decoration:none;
  outline: none;
  color:#08C;
  user-select: none;
}
a:hover {
  opacity:0.85;
  text-decoration: none;
}
/*フォント設定
---------------------------------------------------------------------------*/
.mincho{
  font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3,"ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
/*カラー設定
---------------------------------------------------------------------------*/
:root {
  --main-color: #;
  --link-text-color: #;
}
/*見出し設定
---------------------------------------------------------------------------*/
.pageTtl {
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.pageTtl:before {
  position: absolute;
  content: '';
  top: 100%;
  width: 6%;
  height: 2px;
  border-radius: 2px;
  background-color: #000;
  left: 50%;
  transform: translateX(-50%);
}
.secTtl {
  position: relative;
  display: flex;
  justify-content: center;
  font-size: 2.4rem;
  font-weight: 700;
  margin-bottom: 40px;
}
.secTtl:before {
  position: absolute;
  content: '';
  top: 100%;
  width: 10%;
  height: 3px;
  background-color: #2589d0;
}
/*共通部品
---------------------------------------------------------------------------*/
/*Slide
--------------------------------------*/
.slider{
  display: none;
}
.slider.slick-initialized{
  display: block;
}
/*水平線設定
--------------------------------------*/
.hrStyle1{
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: #000;
  margin-bottom: 20px;
}
/*テーブル設定
---------------------------------------------------------------------------*/
/*フォーム設定
---------------------------------------------------------------------------*/
input, textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1.6rem;
}
input:focus, textarea:focus {
  border-color: #3a6ea5;
  outline: none;
}
input::placeholder, textarea::placeholder {
  color: #ccc;
}
.form-actions {
  margin-top: 35px;
  display: flex;
  justify-content: center;
}
.form-actions:has(> :nth-child(2)) button{
  margin: 0 10px;
}
/*ボタン設定
--------------------------------------*/
button,
input[type="submit"],
input[type="button"]{
  border: none;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.btn-primary {
  background-color: #3a6ea5;
  border-radius: 4px;
  color: #FFF;
  padding: 12px;
  font-size: 1.4rem;
  font-weight: 700;
}
.btn-large {
  display: inline-block;
  background-color: #3a6ea5;
  color: white;
  text-decoration: none;
  padding: 15px 30px;
  border-radius: 8px;
  font-size: 1.2rem;
  font-weight: bold;
  transition: background-color 0.3s;
}
.btn-large:hover {
  background-color: #2c5282;
}
.btn--mg-c {
  margin: 20px 0;
  padding: 10px 20px;
  background: #4CAF50;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}
.btn--mg-c:hover {
  background: #45a049;
}
.cancel-btn {
  display: none;
  background-color: #f44336;
  color: white;
  border: none;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 4px;
}
.cancel-btn:hover {
  background-color: #d32f2f;
}
.btn-delete {
  background-color: #f44336;
  color: white;
  border: none;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 4px;
}
.btn-back{
  background-color: #f5f5f5;
  border-radius: 4px;
  color: #888;
  padding: 12px;
  font-weight: 700;
  border: 1px solid #888;
  text-align: center;
  font-size: 1.4rem;
}
.btn-unsubscribe{
  background-color: #e53e3e;
  color: #FFF;
  border-radius: 4px;
  padding: 8px;
  font-size: 1.4rem;
  font-weight: 700;
  height: 100%;
}
/*アラート設定
---------------------------------------------------------------------------*/
.err {
  color: #ff0000;
  font-size: 0.9em;
  margin-top: 5px;
}

.block-message,
.error-message,
.success-message,
.info-message {
  padding: 10px 15px;
  margin: 10px 0;
  border-radius: 4px;
  font-weight: 700;
}

.block-message {
  background-color: #ffcccc;
  color: #cc0000;
  border: 1px solid #cc0000;
}

.error-message {
  background-color: #ffdddd;
  color: #d8000c;
  border: 1px solid #d8000c;
}

.success-message {
  background-color: #f0fff4;
  color: #38a169;
  border: 1px solid #4b9100;
}

.info-message {
  background-color: #e7f3fe;
  color: #0c5460;
  border: 1px solid #bee5eb;
}
/*カラム設定
---------------------------------------------------------------------------*/
.flexCols {
  display: flex;
  flex-wrap: wrap;
}
.flexAc{
  align-items: center;
}
.flexAfe{
  align-items: flex-end;
}
.flexJc {
  justify-content: center;
}
.flexJc_Ac {
  justify-content: center;;
  align-items: center;
}
.flexJsb{
  justify-content: space-between
}
.flexJsb_Ac{
  justify-content: space-between;
  align-items: center;
}
.flexJsa {
  justify-content: space-around;
}
/*Flex 左寄せ
--------------------------------------*/
/*3カラム
----------------------*/
/*
.container::after{
  content:"";
  display: block;
  width:30%;
}
*/
/*4カラム
----------------------*/
/*
.container::before{
  content:"";
  display: block;
  width:23%;
  order:1;
}
.container::after{
  content:"";
  display: block;
  width:23%;
}
*/
/*
.col_12-pc {
  flex: 0 0 100%;
  max-width: 100%;
}
.col_8-pc {
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}
.col_6-pc {
  flex: 0 0 50%;
  max-width: 50%;
}
.col_4-pc {
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}
*/
/*Layout
---------------------------------------------------------------------------*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  main {
    display: block;
  }
}
.wrapper.no-hdr{
  padding-top: 80px;
}
/*共通コンテンツ
--------------------------------------*/
.innerWrap{
  width: 980px;
  margin: 0 auto;
}
/*Header
---------------------------------------------------------------------------*/
header {
  background-color: #fff;
  border-bottom: 1px solid #ddd;
  margin-bottom: 3rem;
  padding: 1.5rem 0;
}
.hdrInr{
  display: flex;
  align-items: center;
}
.logo a{
  color: #333;
  font-size: 1.8rem;
  font-weight: 700;
}
/*gNavi
--------------------------------------*/
.gNavi {
  margin-left: auto;
}
.gNavi ul {
  display: flex;
}
.gNavi ul li {
  margin-right: 2rem;
}
.gNavi ul li:last-child {
  margin-right: 0;
}
.gNavi ul li a {
  text-decoration: none;
  color: #333;
  font-weight: 700;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1.4rem;
}
/*FOOTER
---------------------------------------------------------------------------*/
footer {
  margin-top: 40px;
  padding: 20px 0 0;
  color: #718096;
  border-top: 1px solid #ddd;
}
.ftrNavi ul {
  display: flex;
  justify-content: center;
}
.ftrNavi ul li {
  margin-right: 2rem;
}
.ftrNavi ul li:last-child {
  margin-right: 0;
}
.ftrNavi ul li a {
  text-decoration: none;
  color: #333;
  font-weight: 700;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1.4rem;
}
.copyRight{
  font-size: 1.2rem;
  text-align: center;
  padding: 10px 0;
}
/*ページアップ btnPagetop
---------------------------------------------------------------------------*/
.js-backToTop {
  right: 20px;
  bottom: 27px;
  position: fixed;
  width: 50px;
  height: 50px;
  z-index: 99;
  display: block;
  text-align: center;
  line-height: 50px;
  color: #66a6ff;
  border: 1px solid #66a6ff;
  background-color: rgba(102, 166, 255,0.2);
  opacity: 0;
  visibility: hidden;
}
.js-backToTop:hover{
  color: #59c3e6;
  border: 1px solid #59c3e6;
  background-color: rgba(89, 195, 230,0.2);
}
.js-backToTop.is-active {
  opacity: 1;
  visibility: visible;
}
/*モーダルウィンドウ用スタイル
---------------------------------------------------------------------------*/
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
}
.modal-content {
  background-color: #fefefe;
  margin: 50px auto;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  width: 90%;
  max-width: 800px;
  position: relative;
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.modal-header h2 {
  margin: 0;
}
.close-modal {
  color: #aaa;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  transition: color 0.3s;
}
.close-modal:hover {
  color: #555;
}
.modal-open-btn {
  background-color: #4CAF50;
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  border-radius: 4px;
  margin: 10px 0;
  font-size: 1.6rem;
}

/*ページネーション
---------------------------------------------------------------------------*/
.pagination {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 20px;
  padding: 10px;
}

.page-link {
  display: inline-block;
  padding: 8px 12px;
  margin: 0 5px;
  text-decoration: none;
  border: 1px solid #ddd;
  color: #333;
  background-color: #f5f5f5;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.page-link:hover {
  background-color: #e9e9e9;
}

.page-link.active {
  background-color: #007bff;
  color: white;
  border-color: #007bff;
}

.page-info {
  margin-left: 15px;
  padding: 8px;
  color: #666;
}
/*icon
---------------------------------------------------------------------------*/
.icon-logout{
  background-color: transparent;
}


/*--------------------------------------------------------------------------
□下層共通 lowerLayer
---------------------------------------------------------------------------*/
/*mainVisual
--------------------------------------*/
/*breadcrumb
--------------------------------------*/
/*Main
---------------------------------------------------------------------------*/

/*ect
---------------------------------------------------------------------------*/
.floatL { float: left; }
.floatR { float: right; }
.alignL {text-align: left!important;}
.alignR {text-align: right!important;}
.alignCR {text-align: center!important;}

.pcNone{display: none!important;}
.pcNone-inl{display: none!important;}
.spNone{display: block!important;}
.spNone-inl{display: inline!important;}

.pc-mt-0{margin-top: 0!important;}
.pc-mt-1{margin-top: 1rem!important;}
.pc-mt-1-5{margin-top: 1.5rem!important;}
.pc-mt-2{margin-top: 2rem!important;}
.pc-mt-2-5{margin-top: 2.5rem!important;}
.pc-mt-3{margin-top: 3rem!important;}
.pc-mt-4{margin-top: 4rem!important;}
.pc-mt-5{margin-top: 5rem!important;}
.pc-mt-6{margin-top: 6rem!important;}

.w100p{width: 100%;}
.w50p{width: 50%;}
.w100{width: 100px;}
.w130{width: 130px;}
.w150{width: 130px;}
.w200{width: 200px;}
.w300{width: 300px;}

.fw700{font-weight: 700;}
.ffs-palt{font-feature-settings: "palt";}
.textNone {text-indent: 100%;white-space: nowrap;overflow: hidden;line-height: 0;}

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

}