/********************************

	テンプレ用固定

********************************
/*スマホ余計な余白解除*/
.container,.container-fluid,.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto,
.col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto,
.col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto,
.col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto,
.col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  padding-left: 3px;
  padding-right: 3px;
}

/*ヘッダー２カラムの下部余白削除*/
.row {
  align-items: flex-end;
}

/* テンプレのヘッダー・フッター表示 */
header {
  display:none;
}
footer{
  display:none;
}

/* PCモバイル表示・非表示 */
.sp {
  display: none;
}
.pc {
  display: block;
}

body{
background-image: linear-gradient(to bottom left, rgba(70, 209, 198, 1), rgba(18, 164, 222, 1)) !important;

}
/********************************

	PC版

********************************/

:root {
  font-size: 62.5%; /* PC用の基準フォントサイズ */
  --black: #4A4A5B;
  --yellow:#FFD746;
  --white:#fff;
  --orange:#ff9000;
  --blue:#1248ac;
  --light-yellow:#FFCCCC;
}

/* リセット */
h1, h2, h3, h4, h5, h6 ,.c-cta-con{
  margin: 0 auto;
  padding: 0;
  font-family: "Hiragino Sans","Noto Sans JP",メイリオ,Meiryo,"ＭＳ Ｐゴシック","MS PGothic,sans-serif" !important;
}

/* ヘッダーテキスト */
h1{
  font-size:3.1rem;
  font-weight: 700;
  line-height: 1.4;
  color:var(--white);
  margin-bottom: 0px;
}
/* 「Perpetua」 */
h1 span.small{
  font-size:3.rem;
}
/* 「Perpetua」 */
h1 span.name{
  font-size:5rem;
  background: linear-gradient(transparent 70%, #595BD9 70%);
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 2px;
  font-weight: 700;
}

/************ リスト ************/
ul {
  padding:0 .5rem 0 3.7rem;
  position: relative;
    margin: 2.5rem auto 0;
      vertical-align: middle;
}
li{
  font-size:2rem;
  margin: 1rem auto;
}

ul li {
    line-height: 1.3;
  list-style-type: none !important;
    color: var(--white);
    font-weight: 600;
font-feature-settings: "palt";
}
ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f00c";
  position: absolute;
  left : 1rem; /*左端からのアイコンまで*/
    color: var(--white);
  font-weight: 600; 
}

/************************* ボタン *************************/
/* ポップアップボタン　 */ 
.c-cta-con, .c-cta-con:active,.c-cta-con:hover {
  background-color: var(--orange) !important;
  border: 2px solid var(--white);
  border-radius: 100vh;
  -webkit-box-shadow: 0 10px 20px 0 rgba(0,0,0,.1);
  box-shadow: 0 10px 20px 0 rgba(0,0,0,.1);
  margin-bottom: 4rem;

}
a,a:hover,a:active{
color:#fff;
}
.c-cta-con  a {
display: block;　
  font-size: 2.8rem;
  font-style: normal;
  font-weight: 800;
  text-align: center;
  padding: 1.8rem 1rem 1.8rem 0;
  max-width:100%;
  width: 350px;
    -moz-transform: none;
    -webkit-transform: none;
    -o-transform: none;
    -ms-transform: none;
  transform: none;
}

/* ポップアップボタン　　「>」 */ 
.c-cta-con a::after {
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  position: absolute;
  color: var(--white); /*アイコン色*/
  font-weight: 800; 
    padding-left: 20px;
}

/* ポップアップボタン　　中央よせ */ 
.c-cta-con {
  display: flex;
  align-items: center;
  justify-content: center;
}


/************************* 本文 *************************/
/* 「本文」 */ 
p,table{
  font-family: "Hiragino Sans","Noto Sans JP",メイリオ,Meiryo,"ＭＳ Ｐゴシック","MS PGothic,sans-serif" !important;
  padding:0;
  font-size: 2rem;
  line-height: 1.3;
  word-break: break-all;
  margin: 0 auto ;
  font-weight:500;
  letter-spacing: 1.1px;
font-feature-settings: "palt";
}
.under-space{
  margin-bottom:15px;
}
/* 「初月無料+永年10%オフ」 */ 
p.point{
  color:var(--white);
  background:#6291F0;
  font-weight:700;
  font-size: 2.5rem;
}

/********************************

	モバイル設定

********************************/

/* モバイルデバイス用のスタイル */
@media (max-width: 922px) {
:root {
  font-size: 50%; /* PC用の基準フォントサイズ */
}

/* その他の要素のスタイル設定... */
.sp {
  display: block; 
}
  
.pc {
  display: none; 
}
  
p{
  font-size: 2.1rem;
}
  
/* ポップアップボタン　 */ 
.c-cta-con, .c-cta-con:active,.c-cta-con:hover  {
  max-width: 85%;
}
  
.hhs-icon-con svg {
  margin-bottom: 0px !important;
}
.header-text{
  padding:4.5rem 0;
}
}

@media (max-width: 575px) {
.hhs-icon-con {
  margin-bottom: 20px!important;
}
}