@charset "UTF-8";
html {
  font-size: 62.5% !important;
}

body {
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif !important;
  background: #fff !important;
  -webkit-text-size-adjust: 100% !important;
  width: 100% !important;
  font-size: 1.4rem !important;
  margin: 0 auto !important;
  line-height: normal;
}

html,
body {
  height: 99.9%;
  overflow: scroll;
}

/*** アプリ用（jsによる付与） ***/
body.app_body {
  overscroll-behavior: none;
}

/*** web非表示用 ***/
.app_pr {
  display: none;
}

/*** web非表示用 ここまで ***/
/*** g〜配下用（phpによる付与） ***/
body.g_body_class header p.pr {
  padding-right: 10px;
}
body.g_body_class div#hamburger {
  display: none;
}

/*** app配下用（phpによる付与） ***/
body.app_body_class {
  /*** MV　***/
  /*** ヘッダー削除対応 ***/
  /*** ヘッダー削除対応 ここまで ***/
}
body.app_body_class.page-template-page-top .mv {
  background-image: url(../img/01_top/mv.png) !important;
}
body.app_body_class header {
  display: none;
}
body.app_body_class .mv-wrapper {
  margin: unset;
}
body.app_body_class.page-template-study-page section.main_section {
  margin-top: unset;
}
body.app_body_class.page-template-study-page section.study {
  margin-top: unset;
}
body.app_body_class.page-template-page-column-list .column-list-wrapper {
  padding-top: 0px;
}
body.app_body_class.page-template-page-column-list .app_pr {
  top: 8px;
  right: 9px;
}
body.app_body_class.page-template-page-search .wrapper {
  padding-top: 10px;
}
body.app_body_class.page-template-page-search .wrapper .result {
  margin: 10px auto;
}
body.app_body_class.page-template-page-research section.main_section, body.app_body_class.page-template-page-about section.main_section, body.app_body_class.page-template-page-privacy-policy section.main_section, body.app_body_class.page-template-page-terms section.main_section {
  margin-top: unset;
}
body.app_body_class.page-template-page-research .app_pr, body.app_body_class.page-template-page-about .app_pr, body.app_body_class.page-template-page-privacy-policy .app_pr, body.app_body_class.page-template-page-terms .app_pr {
  display: none;
}
body.app_body_class div.app_pr {
  background-color: #939393;
  color: white;
  width: 20px;
  height: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 10px;
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 9999;
  border-end-start-radius: 2px;
}
body.app_body_class.page-template-page-auto div.app_pr {
  background-color: rgba(147, 147, 147, 0.6666666667);
}
body.app_body_class.page-template-study-page div.app_pr {
  display: none;
}

/*** app配下用 ここまで ***/
.wrapper {
  max-width: 768px;
}

a {
  text-decoration: none;
  color: #3f6ec2;
  cursor: pointer;
}

p {
  margin: 0px;
  font-size: 1.6rem;
  line-height: 2.5rem;
}

h1,
h2,
h3,
h4,
h5,
h6,
ul,
li {
  margin: 0px;
  padding: 0px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: bold;
}

ul {
  list-style: none;
}

table {
  width: 100%;
}

td,
th {
  vertical-align: middle;
}

.clearboth {
  clear: both;
}

.block {
  display: block;
}

.center {
  text-align: center;
}

span.small {
  font-size: 10px;
}

.btn {
  border-width: 0;
}
.btn a {
  text-decoration: none;
  color: inherit;
  display: block;
}
.btn:hover {
  filter: none;
}

main {
  padding: 0px !important;
}

button {
  text-align: center;
}

footer {
  display: block;
  flex-direction: column;
  align-items: center;
  background-color: #f8f8ff;
  color: #939393;
  border-top: 1px solid #e7e7ff;
  padding: 8px;
}
footer div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 8px;
  margin-top: 24px;
}
footer div a {
  margin-top: 8px;
  display: inline-block;
  width: 46%;
  flex: 1 1 auto;
  color: #939393;
  text-align: center;
}
footer div a:hover {
  color: #939393;
  opacity: 0.6;
}
footer p {
  text-align: center;
}

/***********************************************************/
/******  フォントサイズ・色・マージン・パディング  ***********/
/***********************************************************/
.font-red {
  color: rgb(255, 45, 85);
}

.font-yellow {
  color: #fffc02;
}

.bold {
  font-weight: 600;
}

.small {
  font-size: 1rem;
  line-height: 1.5rem;
  display: inline-block;
}

.middle {
  font-size: 1.3rem;
  font-weight: normal;
  margin-left: 2px;
}

.font2 {
  font-weight: 600;
}

.mt10 {
  margin-top: 10px;
}

.mt20 {
  margin-top: 20px;
}

.mt30 {
  margin-top: 30px;
}

.mt40 {
  margin-top: 40px;
}

.mt50 {
  margin-top: 50px;
}

.mt60 {
  margin-top: 60px;
}

.mt80 {
  margin-top: 80px;
}

.mb10 {
  margin-bottom: 10px;
}

.mb20 {
  margin-bottom: 20px;
}

.mb30 {
  margin-bottom: 30px;
}

.mb40 {
  margin-bottom: 30px;
}

.mb50 {
  margin-bottom: 50px;
}

.displayflex {
  display: flex;
  justify-content: space-between;
}

.ml10 {
  margin-left: 10px;
}

.ml20 {
  margin-left: 20px;
}

.img_centerbox {
  display: block;
  text-align: center;
}

p.bg {
  background-color: #fafaff;
  padding: 20px;
}

/***********************************************/
/*****************  gototop  ******************/
/***********************************************/
#page_top {
  width: 50px;
  height: 50px;
  position: fixed;
  right: 4px;
  bottom: 12%;
  background: #3f6ec2;
  opacity: 0.4;
  z-index: 9997;
  border-radius: 5px;
}
#page_top a {
  position: relative;
  display: block;
  text-decoration: none;
}
#page_top a::before {
  content: "";
  background-image: url(../img/common/top.png);
  background-size: cover;
  width: 31px;
  height: 30px;
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, 30%);
  -webkit-transform: translate(-50%, 30%);
  margin: auto;
  text-align: center;
}
#page_top:hover {
  opacity: 0.2;
}

/***********************************************/
/*****************  header  ******************/
/***********************************************/
nav {
  position: relative;
  z-index: 2;
}

header {
  z-index: 9999;
  border-bottom: 1px solid #e7e7e7;
  position: relative;
  /**   ハンバーガーメニュー ****/
}
header h1 {
  font-size: 2.2rem;
  padding: 8px 0px 0px 10px;
}
header h1 img {
  width: 89%;
  max-width: 214px;
}
header p.pr {
  color: #b2b2b2;
  font-size: 10px;
  flex: 1;
  text-align: right;
  padding-right: 50px;
}
header #hamburger .btn-gNav {
  position: absolute;
  display: block;
  top: 19px;
  right: 10px;
  width: 30px;
  height: 24px;
  z-index: 9999;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 400ms;
}
header #hamburger .btn-gNav span {
  position: absolute;
  width: 80%;
  height: 3px;
  background: #3f6ec2;
  border-radius: 10px;
  transition: all 400ms;
}
header #hamburger .btn-gNav span:nth-child(1) {
  top: 0;
}
header #hamburger .btn-gNav span:nth-child(2) {
  top: 10px;
}
header #hamburger .btn-gNav.open span:nth-child(1) {
  background: #3f6ec2;
  top: 6px;
  transform: rotate(-45deg);
}
header #hamburger .btn-gNav.open span:nth-child(2) {
  top: 6px;
  background: #3f6ec2;
  transform: rotate(45deg);
}
header #gNav {
  position: fixed;
  top: 50px;
  right: -100%;
  width: 100%;
  max-width: 320px;
  height: 100%;
  background: #fff;
  font-size: 16px;
  box-sizing: border-box;
  z-index: 2;
  transition: 0.3s;
  margin: 0px;
}
header #gNav.open {
  right: 0px;
}
header #gNav .gNav-menu {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
}
header #gNav li {
  display: block;
  padding: 16px 0px 16px 20px;
  text-align: left;
  color: #5d5d5d;
  border-bottom: 1px solid #e7e7e7;
  position: relative;
}
header #gNav li:after {
  content: "";
  background-image: url(../img/common/caret.svg);
  background-size: cover;
  width: 19px;
  height: 19px;
  position: absolute;
  right: 20px;
  top: 20px;
}
header #gNav li a {
  display: flex;
  align-items: center;
  color: #5d5d5d;
  text-decoration: none;
}
header #gNav li a:hover {
  opacity: 0.5;
}
header #gNav li a img {
  height: 30px;
  width: 30px;
  margin-right: 10px;
}
header #gNav li a span {
  font-size: 1.4rem;
}

.black-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9998;
  background-color: rgba(0, 0, 0, 0);
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s;
  cursor: pointer;
  overflow-y: scroll;
}

.black-bg.active {
  background-color: rgba(0, 0, 0, 0.6);
  opacity: 1;
  visibility: visible;
  overflow-y: hidden;
}

body.active {
  height: 100%;
  overflow: hidden;
}

/***********************************************/
/*****************  main visual  ******************/
/***********************************************/
.mv {
  position: relative;
}
.mv img {
  width: 100%;
}
.mv .year {
  position: absolute;
  font-size: 1.6rem;
  left: 37%;
  color: #fff;
  bottom: 3%;
}

.page-template-page-top .mv-wrapper .mv {
  position: relative;
  background-image: url(../img/web/mv.webp);
  width: 100%;
  background-size: cover;
}
.page-template-page-top .mv-wrapper .mv img.mv-cat {
  position: absolute;
  right: 0px;
  width: 145px;
}

/***********************************************/
/*************  ボタン   ************************/
/***********************************************/
.btn {
  background-color: #ff6b3e;
  border-radius: 5px;
  padding: 20px;
  text-align: center;
  color: #fff;
  font-size: 2.2rem;
  border-bottom: 3px solid #ff6130;
  font-weight: 600;
  z-index: 1;
  position: relative;
  transition: 0.3s;
}
.btn:after {
  content: url("../img/common/arrow-red.svg");
  position: absolute;
  right: 11px;
  top: 20px;
}
.btn-site {
  width: 250px;
  margin: 0 auto;
}
.btn:hover {
  animation: light 0.8s infinite;
}
@keyframes light {
  100% {
    outline-color: transparent;
    outline-offset: 12px;
  }
}

span.free {
  background-color: rgb(255, 255, 255);
  border-radius: 5px;
  padding: 3px 9px 0px;
  display: inline-block;
  font-size: 1.5rem;
  margin-right: 10px;
  color: #ff6130;
  top: -3px;
  position: relative;
}

/***********************************************/
/*************  ボタンアニメーション  **************/
/***********************************************/
.squash {
  animation: squash 0.8s ease-in-out infinite;
}

@keyframes squash {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.02);
  }
  100% {
    transform: scale(1);
  }
}
.blink {
  animation: blink 0.6s ease-in-out infinite alternate;
}

@keyframes blink {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/************** 評価の★★★★★ ********************/
.rate {
  color: #ffd307;
  width: auto;
  border-bottom: 1px solid #ffd307;
  margin: 10px 0px 30px;
  float: right;
  font-weight: 600;
}
.rate_star {
  position: relative;
  z-index: 0;
  display: inline-block;
  white-space: nowrap;
  color: #cccccc;
  margin-left: 10px;
}
.rate_star:before, .rate_star:after {
  content: "★★★★★";
  font-size: 1.3rem;
}
.rate_star:after {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0px;
  overflow: hidden;
  white-space: nowrap;
  color: #ffc107;
}
.rate_star[data-rate="0"]:after {
  width: 0%;
}
.rate_star[data-rate="1"]:after {
  width: 1%;
}
.rate_star[data-rate="2"]:after {
  width: 2%;
}
.rate_star[data-rate="3"]:after {
  width: 3%;
}
.rate_star[data-rate="4"]:after {
  width: 4%;
}
.rate_star[data-rate="5"]:after {
  width: 5%;
}
.rate_star[data-rate="6"]:after {
  width: 6%;
}
.rate_star[data-rate="7"]:after {
  width: 7%;
}
.rate_star[data-rate="8"]:after {
  width: 8%;
}
.rate_star[data-rate="9"]:after {
  width: 9%;
}
.rate_star[data-rate="10"]:after {
  width: 10%;
}
.rate_star[data-rate="11"]:after {
  width: 11%;
}
.rate_star[data-rate="12"]:after {
  width: 12%;
}
.rate_star[data-rate="13"]:after {
  width: 13%;
}
.rate_star[data-rate="14"]:after {
  width: 14%;
}
.rate_star[data-rate="15"]:after {
  width: 15%;
}
.rate_star[data-rate="16"]:after {
  width: 16%;
}
.rate_star[data-rate="17"]:after {
  width: 17%;
}
.rate_star[data-rate="18"]:after {
  width: 18%;
}
.rate_star[data-rate="19"]:after {
  width: 19%;
}
.rate_star[data-rate="20"]:after {
  width: 20%;
}
.rate_star[data-rate="21"]:after {
  width: 21%;
}
.rate_star[data-rate="22"]:after {
  width: 22%;
}
.rate_star[data-rate="23"]:after {
  width: 23%;
}
.rate_star[data-rate="24"]:after {
  width: 24%;
}
.rate_star[data-rate="25"]:after {
  width: 25%;
}
.rate_star[data-rate="26"]:after {
  width: 26%;
}
.rate_star[data-rate="27"]:after {
  width: 27%;
}
.rate_star[data-rate="28"]:after {
  width: 28%;
}
.rate_star[data-rate="29"]:after {
  width: 29%;
}
.rate_star[data-rate="30"]:after {
  width: 30%;
}
.rate_star[data-rate="31"]:after {
  width: 31%;
}
.rate_star[data-rate="32"]:after {
  width: 32%;
}
.rate_star[data-rate="33"]:after {
  width: 33%;
}
.rate_star[data-rate="34"]:after {
  width: 34%;
}
.rate_star[data-rate="35"]:after {
  width: 35%;
}
.rate_star[data-rate="36"]:after {
  width: 36%;
}
.rate_star[data-rate="37"]:after {
  width: 37%;
}
.rate_star[data-rate="38"]:after {
  width: 38%;
}
.rate_star[data-rate="39"]:after {
  width: 39%;
}
.rate_star[data-rate="40"]:after {
  width: 40%;
}
.rate_star[data-rate="41"]:after {
  width: 41%;
}
.rate_star[data-rate="42"]:after {
  width: 42%;
}
.rate_star[data-rate="43"]:after {
  width: 43%;
}
.rate_star[data-rate="44"]:after {
  width: 44%;
}
.rate_star[data-rate="45"]:after {
  width: 45%;
}
.rate_star[data-rate="46"]:after {
  width: 46%;
}
.rate_star[data-rate="47"]:after {
  width: 47%;
}
.rate_star[data-rate="48"]:after {
  width: 48%;
}
.rate_star[data-rate="49"]:after {
  width: 49%;
}
.rate_star[data-rate="50"]:after {
  width: 50%;
}
.rate_star[data-rate="51"]:after {
  width: 51%;
}
.rate_star[data-rate="52"]:after {
  width: 52%;
}
.rate_star[data-rate="53"]:after {
  width: 53%;
}
.rate_star[data-rate="54"]:after {
  width: 54%;
}
.rate_star[data-rate="55"]:after {
  width: 55%;
}
.rate_star[data-rate="56"]:after {
  width: 56%;
}
.rate_star[data-rate="57"]:after {
  width: 57%;
}
.rate_star[data-rate="58"]:after {
  width: 58%;
}
.rate_star[data-rate="59"]:after {
  width: 59%;
}
.rate_star[data-rate="60"]:after {
  width: 60%;
}
.rate_star[data-rate="61"]:after {
  width: 61%;
}
.rate_star[data-rate="62"]:after {
  width: 62%;
}
.rate_star[data-rate="63"]:after {
  width: 63%;
}
.rate_star[data-rate="64"]:after {
  width: 64%;
}
.rate_star[data-rate="65"]:after {
  width: 65%;
}
.rate_star[data-rate="66"]:after {
  width: 66%;
}
.rate_star[data-rate="67"]:after {
  width: 67%;
}
.rate_star[data-rate="68"]:after {
  width: 68%;
}
.rate_star[data-rate="69"]:after {
  width: 69%;
}
.rate_star[data-rate="70"]:after {
  width: 70%;
}
.rate_star[data-rate="71"]:after {
  width: 71%;
}
.rate_star[data-rate="72"]:after {
  width: 72%;
}
.rate_star[data-rate="73"]:after {
  width: 73%;
}
.rate_star[data-rate="74"]:after {
  width: 74%;
}
.rate_star[data-rate="75"]:after {
  width: 75%;
}
.rate_star[data-rate="76"]:after {
  width: 76%;
}
.rate_star[data-rate="77"]:after {
  width: 77%;
}
.rate_star[data-rate="78"]:after {
  width: 78%;
}
.rate_star[data-rate="79"]:after {
  width: 79%;
}
.rate_star[data-rate="80"]:after {
  width: 80%;
}
.rate_star[data-rate="81"]:after {
  width: 81%;
}
.rate_star[data-rate="82"]:after {
  width: 82%;
}
.rate_star[data-rate="83"]:after {
  width: 83%;
}
.rate_star[data-rate="84"]:after {
  width: 84%;
}
.rate_star[data-rate="85"]:after {
  width: 85%;
}
.rate_star[data-rate="86"]:after {
  width: 86%;
}
.rate_star[data-rate="87"]:after {
  width: 87%;
}
.rate_star[data-rate="88"]:after {
  width: 88%;
}
.rate_star[data-rate="89"]:after {
  width: 89%;
}
.rate_star[data-rate="90"]:after {
  width: 90%;
}
.rate_star[data-rate="91"]:after {
  width: 91%;
}
.rate_star[data-rate="92"]:after {
  width: 92%;
}
.rate_star[data-rate="93"]:after {
  width: 93%;
}
.rate_star[data-rate="94"]:after {
  width: 94%;
}
.rate_star[data-rate="95"]:after {
  width: 95%;
}
.rate_star[data-rate="96"]:after {
  width: 96%;
}
.rate_star[data-rate="97"]:after {
  width: 97%;
}
.rate_star[data-rate="98"]:after {
  width: 98%;
}
.rate_star[data-rate="99"]:after {
  width: 99%;
}
.rate_star[data-rate="100"]:after {
  width: 100%;
}

.number_rating {
  color: #ff1800;
  margin-left: 10px;
  font-weight: 600;
  margin-right: 5px;
}

/********** 追従バナー **********/
#footer_banner.is-show {
  display: block;
}

#footer_banner {
  position: sticky;
  bottom: 0px;
  background-color: #3f6ec2;
  height: 68px;
  z-index: 6;
  display: none;
  margin-bottom: -2px;
  background-image: url(../img/common/footerbanner_v2.png);
  background-repeat: no-repeat;
  background-size: contain;
  overflow: hidden;
}
#footer_banner .imgBox {
  border-radius: 7px;
  background-color: #fff;
  width: 63%;
  max-width: 240px;
}
#footer_banner .footerbanner-logos {
  width: calc(100% - 184px);
  position: absolute;
  top: 5px;
  text-align: center;
  margin-left: 174px;
  height: 58px;
  padding: 2px 0px 4px;
  background-color: #fff;
  border-radius: 5px;
  position: relative;
  overflow: hidden;
}
#footer_banner .footerbanner-logos .logo {
  height: calc(100% - 19px);
}
#footer_banner .footerbanner-logos .logo img {
  height: 100%;
}
#footer_banner .footerbanner-logos .official {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 17px;
  font-weight: bold;
  width: calc(100% - 45px);
  text-align: center;
}
#footer_banner .footerbanner-logos .official img {
  position: absolute;
  height: 100%;
  width: 11px;
}
#footer_banner .footerbanner-logos .official img.official-before {
  left: -1px;
}
#footer_banner .footerbanner-logos .official img.official-after {
  right: -1px;
  transform: scaleX(-1);
}
#footer_banner .footerbanner-logos .official p {
  background-color: red;
  font-size: 11px;
  color: #fff;
  width: 100%;
  line-height: 130%;
  height: 15px;
}

/********** header **********/
.header-wrapper {
  width: 100%;
  margin: 0 auto;
}
.header-wrapper header {
  background-color: #fff;
  width: 100%;
  margin: 0 auto;
  position: fixed;
  top: 0px;
  height: 50px;
  display: flex;
  justify-content: space-between;
}

/********** ロゴ **********/
.logo_anime_wrapper {
  width: 100%;
  margin-bottom: 20px;
  border-bottom: 1px solid rgb(235, 235, 235);
  padding: 10px;
  overflow: hidden;
}
.logo_anime_wrapper .slider {
  display: flex;
}
.logo_anime_wrapper .slider__inner {
  display: flex;
  align-items: center;
}
.logo_anime_wrapper .slider__item {
  margin: 0px 10px;
}
.logo_anime_wrapper .slider__item img {
  height: auto;
  margin: 0px auto;
  width: 150px;
}
.logo_anime_wrapper .slider__inner:first-child {
  animation: loop 90s linear infinite;
}
.logo_anime_wrapper .slider__inner:nth-child(2) {
  animation: loop2 90s -60s linear infinite;
}
.logo_anime_wrapper .slider__inner:last-child {
  animation: loop3 90s -30s linear infinite;
}
@keyframes loop {
  0% {
    transform: translateX(200%);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes loop2 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-200%);
  }
}
@keyframes loop3 {
  0% {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-300%);
  }
}

/********** メインコンテンツ **********/
.main_section {
  display: flex;
  justify-content: space-around;
  margin-top: 30px;
}
.main_section h3 {
  font-size: 2rem;
  position: relative;
  margin-bottom: 10px;
  color: #222;
}
.main_section h3:before {
  display: inline-block;
  width: 20px;
  position: absolute;
  left: 0px;
}

/********** main visual **********/
.mv-wrapper {
  width: 100%;
  margin: 50px auto 0px;
  background-color: #e3ecff;
}
.mv-wrapper .mv {
  margin: 0 auto;
  position: relative;
}
.mv-wrapper .mv .year {
  position: absolute;
  top: 4.1vw;
  left: 3px;
}
.mv-wrapper .mv .year span {
  font-size: 3vw;
  margin-left: 5px;
  font-weight: 600;
  display: block;
  color: #fff;
}

#sidejob .mv {
  background: unset !important;
  aspect-ratio: unset !important;
}

.page-template-page-top .mv-wrapper {
  width: 100%;
  margin: 50px auto 0px;
  background-color: #e3ecff;
  position: relative;
}
.page-template-page-top .mv-wrapper .mv {
  position: relative;
  background-image: url(../img/web/mv.webp);
  width: 100%;
  background-size: cover;
  aspect-ratio: 800/273;
  overflow: hidden;
}
.page-template-page-top .mv-wrapper .mv img.mv-cat {
  position: absolute;
  right: -3px;
  width: 28%;
  aspect-ratio: 145/174;
}
.page-template-page-top .mv-wrapper .mv-bottom {
  background: url(../img/01_top/mv-bottom.png);
  width: 100%;
  background-size: cover;
  aspect-ratio: 800/56;
  position: relative;
  margin-top: -24px;
}
.page-template-page-top .mv-wrapper .mv-bottom .mv-title {
  position: absolute;
  bottom: 0px;
  z-index: 3;
  left: 50%;
  width: 80%;
  transform: translateX(-50%);
}
.page-template-page-top .mv-wrapper .mv-bottom .mv-title img {
  width: 100%;
}

@keyframes korokoro {
  0% {
    transform: translate(0%, 0%);
  }
  5% {
    transform: translate(8%, 0%) rotate(8deg);
  }
  10% {
    transform: translate(-8%, 0%) rotate(-8deg);
  }
  15% {
    transform: translate(8%, 0%) rotate(8deg);
  }
  20% {
    transform: translate(-8%, 0%) rotate(-8deg);
  }
  25% {
    transform: translate(0%, 0%) rotate(0deg);
  }
  100% {
    transform: translate(0%, 0%);
  }
}
h3 {
  font-size: 2.2rem;
  margin: 20px 0px 5px 0px;
}

.merit {
  background-color: #eeeffb;
  padding: 20px;
}
.merit_box ul {
  margin: 10px;
}
.merit_box ul li {
  width: 100%;
  position: relative;
  background-color: #5b61d9;
  color: #fff;
  font-size: 2rem;
  font-weight: 600;
  padding: 10px 7px 3px;
  border-radius: 5px;
  text-align: center;
  margin-bottom: 20px;
}
.merit_box ul li span {
  position: absolute;
  border-radius: 30px;
  display: block;
  color: #5b61d9;
  font-size: 1.5rem;
  width: 31%;
  left: 35%;
  top: -12px;
  background-color: #eeeffb;
  font-weight: 600;
}
.merit_box ul li b {
  color: #f6ff00;
}
.merit_box_content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
}
.merit_box_content img {
  width: 40%;
}
.merit_box_content p {
  background-color: #fff;
  border-radius: 10px;
  padding: 10px;
  display: block;
  margin-left: 20px;
  font-size: 1.3rem;
  line-height: 2rem;
}

/***********  beginner　**************/
.fxsearch {
  width: 96%;
  border-radius: 10px;
  margin: 13px auto;
  border: 1px solid #3f6ec2;
}
.fxsearch h3 {
  font-size: 1.7rem;
  padding: 7px 0px 3px 40px;
  background-color: #345ba1;
  color: #fff;
  margin: 0px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  position: relative;
}
.fxsearch h3:before {
  content: "";
  background-image: url("../img/common/search-white.svg");
  position: absolute;
  left: 12px;
  top: 8px;
  width: 20px;
  height: 20px;
}
.fxsearch h4 {
  font-size: 14px;
  margin-bottom: 0px;
  background-color: #3f6ec2;
  color: #fff;
  padding: 4px 0px 4px 10px;
}
.fxsearch-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 96%;
  margin: 10px auto;
}
.fxsearch-box-wrapper {
  margin: 0 auto;
  width: 96%;
}
.fxsearch-box.box01 div {
  width: 32%;
}
.fxsearch-box.box02 div {
  width: 49%;
  margin-bottom: 10px;
}
.fxsearch-box.box03 div {
  width: 32%;
  margin-bottom: 10px;
}
.fxsearch-box.box03 div label {
  border-radius: 20px;
}
.fxsearch-box input {
  display: none;
}
.fxsearch-box label {
  background-color: #fff;
  border-radius: 4px;
  font-size: 13px;
  border: 1px solid #c5c5c5;
  color: #2b2b2b;
  text-align: center;
  padding: 8px 0px;
  display: block;
  width: 100%;
}
.fxsearch-box input[type=radio]:checked + label {
  background-color: #edf4ff;
  border: 1px solid #3f6ec2;
}
.fxsearch-box input[type=checkbox]:checked + label {
  background-color: #edf4ff;
  border: 1px solid #3f6ec2;
}
.fxsearch button {
  background-color: #3f6ec2;
  color: #fff;
  padding: 16px 0px;
  width: 100%;
  width: 80%;
  margin: 0 auto 20px;
  display: block;
  border: none;
  border-radius: 8px;
  border-bottom: 4px solid #030b1a;
  font-size: 1.7rem;
  position: relative;
  align-items: center;
}
.fxsearch button::after {
  content: "";
  background-image: url(../img/common/arrow-search.svg);
  width: 22px;
  height: 22px;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translate(-10px, -50%);
  -webkit-transform: translate(-10px, -50%);
}

/***********  beginner　**************/
.beginner_box {
  background-color: #eff0ff;
  padding: 30px 0px;
  margin-bottom: 20px;
}
.beginner_box img {
  display: block;
  text-align: center;
  margin: 0 auto;
}
.beginner_box h3 {
  display: block;
  text-align: center;
  margin: 15px 0px 0px;
  position: relative;
  line-height: 15px;
  font-size: 2rem;
}
.beginner_box h3.longtitle img {
  top: -20px;
  position: relative;
}
.beginner_box h3.longtitle span {
  text-align: left;
  display: inline-block;
  line-height: 3rem;
}
.beginner_box h3 img {
  width: 42px;
  height: 42px;
  margin-right: 14px;
  display: inline-block;
}
.beginner_box h3:first-child {
  margin-top: 0px;
}
.beginner_box img.whatisfx {
  width: 100%;
  margin: 20px auto 0px;
}
.beginner_box img.campaign {
  margin: 10px auto 20px;
  width: 100%;
}
.beginner_box img.free {
  width: 100%;
  max-width: 420px;
}
.beginner_box_content {
  text-align: left;
  padding: 15px 10px;
  background-color: #fff;
  margin: 10px 10px 50px;
  border: 1px solid #c3c6f2;
}
.beginner_box_content .small-btn {
  color: #1495d0;
  text-decoration: underline;
  cursor: pointer;
  display: inline-block;
}
.beginner_box_content .small-btn:hover {
  text-decoration: none;
}
.beginner_box_content_flex img {
  max-width: 130px;
  width: 100%;
  margin: 0 auto 15px;
  text-align: center;
  display: block;
}
.beginner_box_content_flex p.comment {
  background-color: #ffefef;
  padding: 15px;
  border-radius: 10px;
  position: relative;
  display: inline-block;
}
.beginner_box_content h4 {
  font-weight: 600;
  font-size: 16px;
  color: #2831db;
  display: block;
  padding: 5px 10px;
  border: 2px dotted #2831db;
  margin-bottom: 10px;
  margin-top: 50px;
  width: 100%;
  text-align: center;
  position: relative;
}
.beginner_box_content h4:first-child {
  margin-top: 20px;
}
.beginner_box_content h4.knowledge_detail_title {
  border-radius: 30px;
}
.beginner_box_content h4.knowledge_detail_title::after {
  content: "";
  background-image: url("../img/03_beginner/arrow-down.svg");
  display: inline-block;
  width: 13px;
  position: absolute;
  right: 21px;
  height: 9px;
  top: 14px;
}
.beginner_box_content h4.knowledge_detail_title.selected::after {
  content: "";
  background-image: url("../img/03_beginner/arrow-down.svg");
  transform: rotateX(180deg);
}
.beginner_box_content p {
  text-align: left;
  width: 100%;
  margin: 0 auto 10px;
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 2.4rem;
}
.beginner_box_content img.demo {
  max-width: 300px;
  width: 100%;
}
.beginner_box_content ul {
  width: calc(100% - 200px);
  text-align: left;
  margin: 0 auto;
}
.beginner_box_content ul li {
  margin-bottom: 5px;
}
.beginner_box_content .currency {
  border: 2px dotted #c3c6f2;
  margin: 20px auto;
  padding: 10px;
  width: 100%;
}
.beginner_box_content .currency_title {
  overflow: hidden;
  display: block;
  text-align: center;
  margin-bottom: 20px;
}
.beginner_box_content .currency_rank {
  text-align: center;
  width: 100%;
  padding: 6px;
  margin-bottom: 10px;
  background-color: #f7f7ff;
  font-size: 1.5rem;
}
.beginner_box_content .currency_volatility {
  text-align: center;
  width: 100%;
  padding: 6px;
  background-color: #f7f7ff;
}
.beginner_box_content .currency img {
  display: inline-block;
}
.beginner_box_content .currency strong {
  font-size: 1.7rem;
  margin-right: 20px;
}
.beginner_box .knowledge {
  margin: 0 auto;
}
.beginner_box .knowledge_detail {
  position: relative;
}
.beginner_box .btn {
  background-color: #4caf50;
  border-radius: 5px;
  text-align: center;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  width: 95%;
  margin: 10px 10px 30px;
  z-index: 1;
  position: relative;
  outline: #3c953f solid 1px;
  outline-offset: 0px;
  transition: all 0.3s ease 0s;
  border-bottom: 3px solid #237e27;
  position: relative;
  width: calc(100% - 20px);
  padding: 10px;
}
.beginner_box .btn::after {
  content: "";
  background-image: url("../img/03_beginner/arrow-white.svg");
  display: inline-block;
  width: 20px;
  height: 17px;
  right: 18px;
  top: 35px;
  position: absolute;
}
.beginner_box .btn::before {
  content: "";
  background-image: url("../img/03_beginner/arrow-white.svg");
  display: inline-block;
  width: 20px;
  height: 17px;
  left: 18px;
  top: 35px;
  position: absolute;
}
.beginner_box .btn span.free {
  background-color: white;
  border-radius: 5px;
  padding: 3px 9px;
  display: block;
  font-size: 1.5rem;
  margin: 6px auto 0px;
  color: rgb(35, 126, 39);
  width: 110px;
  position: relative;
}
.beginner_box ul.qanda {
  margin: 0px 10px;
}
.beginner_box ul.qanda li {
  padding: 10px;
  border-radius: 5px;
  margin: 10px auto;
  border: 1px solid #c3c6f2;
  background-color: #fff;
  color: #008eff;
  font-size: 1.5rem;
  font-weight: 600;
  position: relative;
}
.beginner_box ul.qanda li:after {
  content: "";
  background-image: url(../img/common/arrow-down.svg);
  display: inline-block;
  width: 15px;
  position: absolute;
  right: 21px;
  height: 9px;
  top: 18px;
}
.beginner_box ul.qanda li.answer {
  color: #222;
  font-weight: normal;
  display: none;
  padding: 10px 20px;
  line-height: 2.6rem;
}

.read {
  padding: 10px 30px;
  line-height: 2.8rem;
  border: 3px solid #ffc107;
  margin: 10px;
  display: flex;
  position: relative;
  padding: 10px 10px 17px 10px;
  background-size: auto auto;
  background-color: #fffff1;
  background-image: repeating-linear-gradient(45deg, transparent, transparent 6px, #fffae5 6px, #fffae5 12px);
}
.read p {
  font-size: 1.3rem;
  line-height: 2rem;
  color: #000;
}
.read p .font-red {
  font-weight: 600;
}
.read:after {
  content: "";
  position: absolute;
  bottom: -51px;
  right: 0px;
  content: "";
  width: 72px;
  height: 72px;
  background-image: url(../img/common/read-women.png);
  background-size: contain;
}

/********* 案件 *************/
.ranking_award {
  border: 2px solid #3f6ec2 !important;
}
.ranking_award .service_title span {
  color: white;
}
.ranking_award .service_title .sougou {
  color: #222;
}
.ranking_award .service_title_rate {
  border: none;
}
.ranking_award h4 {
  background-color: #ffd746;
}
.ranking_award h4 span {
  margin-left: 60px !important;
}
.ranking_award h4 img.ranking_crown {
  display: block !important;
  width: 59px;
  margin-top: 2px;
  position: absolute;
  top: -9px;
  left: 5px;
}
.ranking_award img.ranking_ribon {
  display: none;
}
.ranking_award .canvas {
  display: none;
}
.ranking_award .service_detail_point {
  width: 100%;
}

.service {
  border: 1px solid #3f6ec2;
  margin-bottom: 45px;
  padding-bottom: 10px;
  position: relative;
  margin: 10px 10px 5px;
  /************　口コミ **************/
}
.service.hide {
  display: none;
}
.service.hide * {
  transition: all 0.4s ease-out;
}
.service_title {
  position: relative;
  height: 50px;
}
.service_title_rate {
  width: 100%;
  font-size: 1.2rem;
  background-color: #505050;
  justify-content: space-around;
  margin: 7px auto;
}
.service_title_rate .sougou {
  color: #fff;
  text-align: center;
  line-height: 100%;
  padding: 5px 0px;
  background-color: #222;
}
.service_title_rate .score {
  font-size: 1.2rem;
  color: #fff;
  margin-left: 2px;
}
.service_title_rate_box {
  display: flex;
  justify-content: space-evenly;
}
.service h4 {
  font-size: 2rem;
  padding-left: 10px;
  display: flex;
  align-items: center;
  min-height: 44px;
  background-color: #3f6ec2;
}
.service h4 img {
  width: 44px;
  top: -2px;
}
.service h4 img.ranking_crown {
  display: none;
}
.service h4 span {
  margin-left: 10px;
  font-size: 2rem;
  line-height: 2.5rem;
  display: inline-block;
  color: #fff;
}
.service_keyphrase {
  color: rgb(255, 22, 22);
  text-align: center;
  font-weight: 600;
  padding: 5px;
  font-size: 1.6rem;
  line-height: 2.2rem;
}
.service_keyphrase b {
  background: linear-gradient(transparent 70%, #fbff47 50%);
}
.service_content {
  margin: 10px 10px 0px;
  display: flex;
  gap: 6px;
}
.service_content_left {
  width: calc(50% - 5px);
}
.service_content_right {
  width: calc(50% - 5px);
}
.service_content a.banner_link {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.service_content a.banner_link img.banner {
  width: 100%;
  max-width: 340px;
  margin: 0px auto;
  display: block;
}
.service_content_point {
  margin: 10px 0px;
  border: 2px solid #b9beea;
  background-color: #f7fbff;
  padding: 5px 0px 0px 10px;
}
.service_content_point ul {
  margin: 5px 5px 0px 0px;
}
.service_content_point ul li {
  color: #ff2d55;
  font-weight: 600;
  font-size: 1.4rem;
  line-height: 2rem;
  margin: 0px 0px 6px;
  position: relative;
  padding-left: 18px;
}
.service_content_point ul li:before {
  content: "";
  width: 15px;
  height: 13px;
  display: inline-block;
  background-image: url("../img/common/checkbox.svg");
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  left: 0px;
  top: 3px;
}
.service_content_point_title {
  padding: 0px 5px 0px 28px;
  color: #2b0074;
  font-weight: 600;
  font-size: 1.7rem;
  position: relative;
  margin: 4px 5px 10px 0px;
  border-bottom: 1px dotted #b9beea;
}
.service_content_point_title:before {
  content: url(../img/common/point.svg);
  width: 20px;
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 0px;
}
.service_content ul {
  display: flex;
  flex-wrap: wrap;
}
.service_content ul li {
  border: 1px dotted #3f6ec2;
  padding: 0px 2px 0px;
  font-size: 1rem;
  margin: 0px 2px 3px;
  border-radius: 2px;
  background-color: #eff5ff;
  color: #3f6ec2;
  line-height: 1.4;
}
.service_content ul li.notactive {
  color: #b8b8b8;
  background-color: #fafafa;
  border: 1px dotted #b9b9b9;
}
.service .service_spread_table {
  padding: 16px 10px 10px 10px;
}
.service .service_spread_table_title {
  font-size: 12px;
  font-weight: bold;
  line-height: 100%;
  position: relative;
  padding-left: 17px;
  padding-bottom: 6px;
}
.service .service_spread_table_title::after {
  position: absolute;
  top: 1px;
  left: 5px;
  content: "";
  width: 8px;
  height: 8px;
  background-color: #222;
  z-index: 2;
}
.service .service_spread_table_title span {
  font-size: 10px;
  font-weight: normal;
}
.service .service_spread_table table th {
  height: 30px;
  background-color: #f5f5f5;
  color: rgb(102, 102, 102);
  font-size: 10px;
  text-align: center;
}
.service .service_spread_table table td {
  height: 40px;
  font-size: 12px;
  text-align: center;
  font-weight: bold;
  padding: 2px;
}
.service .service_table table {
  border: 1px solid #e5e5e5;
  width: 100%;
}
.service .service_table tbody {
  display: table;
  width: 100%;
}
.service .service_table th {
  background-color: rgb(245, 245, 245);
  color: rgb(102, 102, 102);
  text-align: center;
  border-right: 1px solid rgb(221, 221, 221);
  font-size: 1rem;
  line-height: 103%;
  padding: 4px;
  height: 30px;
}
.service .service_table th:last-child {
  border: none;
}
.service .service_table tr {
  border-bottom: 1px solid #ddd;
}
.service .service_table td {
  text-align: center;
  border-right: 1px solid #e3e3e3;
  color: #262626;
  font-size: 1.1rem;
  padding: 4px 0px;
  min-width: 100px;
}
.service .service_table td.table table {
  border: 0px;
}
.service .service_table td.table table tr {
  border-left: 0px;
}
.service .service_table td:last-child {
  border: none;
  background-color: #fff;
}
.service .service_table td .circle {
  width: 18px;
}
.service .comment {
  font-size: 1.6rem;
  display: inline-block;
  margin-left: 15px;
  font-weight: 600;
  color: #3f6ec2;
  margin-top: 6px;
}
.service .light {
  width: 20px;
  display: inline-block;
  position: relative;
  top: -2px;
  margin-right: 5px;
}
.service p.description {
  margin: 5px 10px;
}
.service .kuchikomi {
  width: 18px;
  display: inline-block;
  position: relative;
  top: -2px;
  margin-right: 5px;
}
.service .review_box {
  margin: 5px 10px 0px 10px;
  display: flex;
  overflow: scroll;
  flex-wrap: wrap;
  height: 190px;
}
.service .review_box .review_box_list {
  width: 100%;
  border: 1px solid #d8d8d8;
  padding: 10px;
  border-radius: 10px;
  margin-bottom: 10px;
}
.service .review_box .review_box_list .person {
  display: flex;
  justify-content: space-between;
}
.service .review_box .review_box_list .person span {
  font-size: 1.2rem;
  margin-right: 10px;
}
.service .review_box .review_box_list .person .rate_star {
  display: inline-block;
  margin: 0px 20px 0px 0px;
}
.service .review_box .review_box_list .person .rate_star::after {
  top: 0px;
}
.service .review_box .review_box_list p {
  font-size: 1.3rem;
  line-height: 1.8rem;
  background: none;
  margin: 5px 0px 0px 0px;
  padding: 0px;
}
.service .review_box .postdate {
  font-size: 1rem;
  color: #a6a6a6;
  margin-top: 5px;
  text-align: right;
}
.service .morereview {
  margin: 3px 10px 0px 0px;
  text-align: right;
}
.service .morereview a {
  font-size: 1.4rem;
  color: #1595d0;
  text-decoration: underline;
}
.service .morereview a:hover {
  text-decoration: none;
}
.service .spread-notice {
  font-size: 9px;
  text-align: right;
  display: block;
  margin-right: 10px;
}
.service p {
  margin: 10px;
  padding: 10px;
  background-color: #f5f5f5;
  color: #444444;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.service p.ad_url_text {
  margin: 0;
  padding: 0;
  padding-top: 4px;
  padding-right: 10px;
  background-color: transparent;
  text-align: right;
  font-size: 1.2rem;
}
.service .btn {
  margin: 10px;
  width: 92%;
  margin: 40px auto 10px;
  position: relative;
  display: block;
  padding: 0px;
}
.service .btn a {
  padding: 28px 0px 5px;
}
.service .btn:hover {
  cursor: pointer;
}
.service .btn-site {
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 230px;
  margin: 0 auto;
  padding-left: 20px;
  letter-spacing: 0px;
}
.service .btn-site b {
  font-size: 1.8rem;
}
.service .btn-site img {
  width: 40px;
  height: 15px;
  position: relative;
  top: 5px;
  margin-left: 6px;
}
.service .btn span.btn-atention {
  position: absolute;
  display: inline-block;
  width: 95%;
  background-color: #ffeb3b;
  color: #222;
  left: 4%;
  top: -19%;
  border-radius: 15px;
  border: 1px solid #ffc107;
  padding: 4px 0px 2px;
  font-size: 1.3rem;
  letter-spacing: 0px;
}
.service .btn span.btn-atention span {
  color: #ff2d55;
  font-weight: 600;
  padding: 0px 3px;
}
.service .btn span.btn-atention:before {
  background-image: url(../img/common/bill.svg);
  background-size: contain;
  width: 47px;
  content: "";
  position: absolute;
  left: -14px;
  top: -8px;
  height: 43px;
}
.service .btn span.btn-atention:after {
  background-image: url(../img/common/bill.svg);
  background-size: contain;
  width: 47px;
  content: "";
  position: absolute;
  right: -15px;
  top: -8px;
  height: 43px;
  transform: rotateY(180deg);
}
.service .gotodetail {
  text-align: center;
  font-size: 1.7rem;
  margin-bottom: 10px;
}
.service .gotodetail a {
  color: #1495d0;
  text-decoration: underline;
}
.service .gotodetail a:hover {
  text-decoration: none;
}

.attention {
  margin-left: 10px;
}

.notice {
  color: #777;
  margin-left: 20px;
  font-size: 1rem;
  line-height: 1.5rem;
  display: inline-block;
}

/* 案件ここまで */
/****************  比較表 ******************/
.compare {
  margin: 20px 10px;
}
.compare tr.hide {
  display: none;
}
.compare .hide_row * {
  transition: all 0.4s ease-out;
}
.compare .hide * {
  transition: all 0.4s ease-out;
}
.compare div.table {
  overflow: inherit;
  margin-bottom: 4px;
  border: 1px solid #cbcbcb;
}
.compare_change {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #3f6ec2;
}
.compare_change_btn {
  color: #fff;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  font-weight: 600;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  align-items: center;
  width: 150px;
}
.compare_change_btn img {
  height: 35px;
}
.compare_change h4 {
  font-size: 1.5rem;
  color: #3f6ec2;
  text-align: center;
  padding: 2px 6px;
  position: relative;
  background-color: #fff;
  margin-right: 7px;
  border-radius: 4px;
}
.compare_change h4::before {
  content: "";
  display: inline-block;
  margin-right: 20px;
  width: 40px;
  height: 2px;
  background-color: #3f6ec2;
  position: absolute;
  left: -50px;
  top: 17px;
}
.compare_change a {
  color: #fff;
  display: block;
}

.compare_show_more_box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  text-decoration: none;
  transition: 0.3s;
  position: relative;
  margin: 0 auto;
  z-index: 4;
  width: 130px;
  color: #fff;
}
.compare_show_more_box .compare_show_more_button {
  color: #fff;
  display: none;
  line-height: 110%;
  position: absolute;
  top: -10px;
  text-align: center;
  background-color: #3f6ec2;
  border-radius: 3px;
  font-weight: bold;
  padding: 5px 30px 5px 17px;
}
.compare_show_more_box .compare_show_more_button:after {
  display: block;
  content: "";
  background-color: #fff;
  position: absolute;
  width: 10px;
  height: 2px;
  top: 50%;
  right: 10px;
  transform: translate(-50%, -50%);
}
.compare_show_more_box .compare_show_more_button:before {
  display: block;
  content: "";
  background-color: #fff;
  position: absolute;
  top: 50%;
  right: 18px;
  transform: translate(-50%, -50%);
  width: 2px;
  height: 10px;
}
.compare_show_more_box .compare_show_more_button.active {
  display: block;
}
.compare_show_more_box .compare_close_button {
  color: #fff;
  display: none;
  line-height: 110%;
  position: absolute;
  top: 2px;
  text-align: center;
  background-color: #3f6ec2;
  border-radius: 3px;
  font-weight: bold;
  padding: 5px 30px 5px 20px;
}
.compare_show_more_box .compare_close_button:after {
  display: block;
  content: "";
  background-color: #fff;
  position: absolute;
  width: 10px;
  height: 2px;
  top: 50%;
  right: 9px;
  transform: translate(-50%, -50%);
}
.compare_show_more_box .compare_close_button.active {
  display: block;
}

.service_show_more_box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  text-decoration: none;
  transition: 0.3s;
  position: relative;
  margin: 10px auto;
  z-index: 4;
  width: 230px;
  color: #fff;
}
.service_show_more_box .service_show_more_button {
  color: #fff;
  display: none;
  line-height: 110%;
  text-align: center;
  background-color: #3f6ec2;
  border-radius: 3px;
  font-weight: bold;
  padding: 5px 30px 5px 17px;
}
.service_show_more_box .service_show_more_button:after {
  display: block;
  content: "";
  background-color: #fff;
  position: absolute;
  width: 10px;
  height: 2px;
  top: 50%;
  right: 10px;
  transform: translate(-50%, -50%);
}
.service_show_more_box .service_show_more_button:before {
  display: block;
  content: "";
  background-color: #fff;
  position: absolute;
  top: 50%;
  right: 18px;
  transform: translate(-50%, -50%);
  width: 2px;
  height: 10px;
}
.service_show_more_box .service_show_more_button.active {
  display: block;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.panel {
  display: none;
  position: relative;
}

.panel.active {
  display: block;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
}

.foot_note {
  display: none;
}

.foot_note.active {
  display: inline-table;
}

div.table {
  overflow: auto;
  margin-bottom: 10px;
}

.compare #compare-panel01 td {
  width: 80px;
  font-weight: 600;
  color: #2e2e2e;
  line-height: 103%;
}
.compare table {
  width: -moz-max-content;
  width: max-content;
  max-width: none;
  margin-bottom: 0px;
  min-width: 100%;
  height: 100%;
  border-collapse: separate;
  table-layout: fixed;
}
.compare table tbody tr.tr_award td {
  background-color: #fff597;
}
.compare table td {
  position: relative;
}
.compare table td:first-child {
  padding-top: 22px;
}
.compare table td div.rank span {
  color: #3f6ec2;
  display: inline-block;
  padding: 2px 5px;
  font-size: 15px;
}
.compare #compare-panel02 td.company {
  position: sticky;
}
.compare #compare-panel03 th {
  width: 60px;
}
.compare #compare-panel03 th:last-child {
  width: 120px;
}
.compare tbody {
  display: table;
  min-width: 100%;
  height: 100%;
}
.compare tr {
  border-bottom: 1px solid #cbcbcb;
}
.compare tr.tr-title {
  height: 35px;
}
.compare .title {
  width: 83px;
  position: sticky;
  left: 0px;
  font-weight: 600;
  z-index: 3;
  font-size: 1.4rem;
  color: #585858;
  padding: 5px 2px;
}
.compare th {
  background-color: #f5f5f5;
  padding: 0px;
  text-align: center;
  border-right: 1px solid #ddd;
  color: #2e2e2e;
  position: relative;
  height: 35px;
}
.compare th a {
  height: 76px;
  display: block;
}
.compare th img {
  width: 120px;
}
.compare th:nth-child(1) {
  width: 124px;
  z-index: 4;
  border-collapse: separate;
}
.compare th .rank {
  background-color: #5b61d9;
  color: #fff;
  font-weight: 600;
  width: 100%;
  margin-bottom: 10px;
  z-index: 2;
}
.compare th .logo {
  height: 35px;
}
.compare th a:hover img {
  opacity: 0.8;
}
.compare th a:hover span {
  text-decoration: none;
}
.compare th span.service_name {
  margin-top: 5px;
  display: inline-block;
  color: #1495d0;
  font-weight: 600;
  text-decoration: underline;
  line-height: 1.7rem;
}
.compare td {
  border-right: 1px solid #cbcbcb;
  text-align: center;
  position: relative;
  padding: 2px;
  line-height: 1.7rem;
  border-bottom: 1px solid #cbcbcb;
}
.compare td table.spread_table td {
  width: 40px !important;
}
.compare td table.spread_table td:first-child {
  padding: 0px;
}
.compare td table.spread_table td:first-child {
  width: 60px;
}
.compare td.company {
  position: sticky;
  z-index: 2;
  width: 124px;
  background-color: #fff;
  left: 0px;
}
.compare td.company b {
  display: block;
  font-size: 10px;
  letter-spacing: 0px;
}
.compare td.company img {
  width: 100%;
  max-width: 125px;
}
.compare td.rank {
  position: sticky;
  left: 0;
  z-index: 3;
  background-color: #5b61d9 !important;
  color: #fff;
  border-collapse: separate;
}
.compare td.rank1 {
  background-color: #ffd700 !important;
  font-weight: 600;
  position: sticky;
  left: 0;
  z-index: 3;
  border-collapse: separate;
}
.compare td.rank2 {
  background-color: #cbcbcb !important;
  font-weight: 600;
  position: sticky;
  left: 0;
  z-index: 3;
  border-collapse: separate;
}
.compare td.rank3 {
  background-color: #d19d00 !important;
  font-weight: 600;
  position: sticky;
  left: 0;
  z-index: 3;
  border-collapse: separate;
}
.compare td.nopadding {
  padding: 0px !important;
  border-right: 0px;
  border-bottom: 0px;
}
.compare td:first-child {
  background-color: #fff;
}
.compare td img.score {
  width: 23px;
  margin: 0px auto 3px;
  display: block;
}
.compare td img.score {
  width: 23px;
  margin: 0px auto 3px;
  display: block;
}
.compare td a.btn {
  font-size: 1.5rem;
  letter-spacing: 0px;
  display: block;
  text-align: left;
  border-radius: 5px;
  position: relative;
  text-align: center;
  padding: 4px 0px;
  line-height: 1.8rem;
  margin: 0px 4px;
  border-bottom: 3px solid #952f10;
}
.compare td a.btn-small {
  font-size: 1.1rem;
  line-height: 1.4rem;
  border-radius: 2px;
  margin: 3px 4px;
  padding: 3px 0px 0px;
  width: 96px;
  margin: 1px auto 3px;
}
.compare td a.btn span {
  display: block;
  font-size: 1.3rem;
  background-color: #fff;
  width: 42px;
  margin: 0 auto 5px;
  color: #ff5825;
  padding: 2px 5px 1px;
  border-radius: 3px;
}
.compare td a.btn:after {
  content: none;
  width: 18px;
  height: 18px;
  display: inline-block;
  position: absolute;
  top: 40%;
  right: 8px;
}

.footer-info {
  padding: 0px 10px;
  margin-top: 40px;
}
.footer-info h3 {
  font-size: 15px;
}
.footer-info-wrapper {
  color: #797979;
}
.footer-info-box {
  margin: 10px 0px;
}
.footer-info-box p {
  color: #797979;
  font-size: 11px;
  line-height: 150%;
}

/* footer */
.footer-wrapper {
  background-color: #f8f8ff;
  margin-top: 40px;
}
.footer-wrapper footer {
  margin: 0;
  padding: 0px;
  display: flex;
  justify-content: center;
  font-size: 1.3rem;
  min-width: 100%;
}
.footer-wrapper footer ul {
  width: 48%;
}
.footer-wrapper footer ul li {
  margin-bottom: 2px;
  color: #57576c;
}
.footer-wrapper footer ul li a:hover {
  color: #69bbe1;
  text-decoration: underline;
}
.footer-wrapper p {
  width: 100%;
  font-size: 1.2rem;
  text-align: center;
  color: #939393;
  padding: 10px;
  border-top: 1px solid #e7e7ff;
}

@media screen and (max-width: 350px) {
  .fxsearch-box03 label {
    font-size: 12px;
  }
  .service .btn span.btn-atention {
    font-size: 1.2rem;
  }
  .service .btn span.btn-atention:before {
    width: 35px;
    left: -21px;
    top: -3px;
    height: 33px;
  }
  .service .btn span.btn-atention:after {
    width: 35px;
    right: -21px;
    top: -3px;
    height: 33px;
  }
  .service .btn {
    padding: 28px 0px 5px 28px;
    font-size: 1.8rem;
  }
  .service .btn:after {
    right: 20px;
  }
  .service .btn span {
    font-size: 2rem;
    text-align: center;
  }
  .service .btn span.btn-atention span {
    font-size: 1.2rem;
  }
  .compare_change .active {
    font-size: 1.2rem;
  }
  .compare_change .active:after {
    content: none;
  }
  .beginner_box .btn {
    font-size: 16px;
  }
}
@media screen and (min-width: 768px) {
  .mv-wrapper .mv .year {
    top: 34px;
  }
  .mv-wrapper .mv .year span {
    font-size: 20px;
  }
}
/*****************  howto   ********************/
.howto .howto_box {
  background-color: #fff;
  padding: 30px;
  margin: 10px 10px 0;
  font-size: 1.5rem;
  margin-bottom: 20px;
  border: 2px solid #a4a4a4;
}
.howto .howto_box p {
  font-size: 1.5rem;
}
.howto img.center {
  display: block;
  text-align: center;
  margin: 10px auto;
}
.howto h3 {
  display: block;
  text-align: center;
  margin: 0 auto 25px;
  background-size: auto auto;
  background-color: rgb(63, 81, 181);
  background-image: repeating-linear-gradient(45deg, transparent, transparent 8px, rgb(74, 94, 208) 8px, rgb(74, 94, 208) 15px);
  color: #fff;
  padding: 10px 0px;
}
.howto h4 {
  font-size: 2rem;
  text-align: center;
  border: 2px dotted #3f51b5;
  margin-top: 20px;
  margin-bottom: 10px;
  padding: 7px;
  color: #3f51b5;
}
.howto .howto-btn {
  border: 2px solid #1595d0;
  text-align: center;
  width: 41%;
  margin: 20px auto 50px;
  font-weight: 600;
  color: #1595d0;
  font-size: 1.4rem;
  position: relative;
}
.howto .howto-btn a {
  padding: 8px;
  display: inline-block;
  width: 100%;
}
.howto .howto-btn a:after {
  content: "";
  background-image: url(../img/04_howto/howto-btn-arroow.png);
  right: 10px;
  background-size: cover;
  width: 22px;
  height: 17px;
  top: 10px;
  position: absolute;
}
.howto .howto-btn a:hover {
  color: #fff;
  background-color: #1595d0;
}
.howto .howto-btn a:hover:after {
  content: "";
  background-image: url(../img/04_howto/howto-btn-arroow-white.png);
  right: 10px;
}
.howto .howto-btn .swap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.howto .howto-btn .swap p {
  width: 65%;
}
.howto .howto-btn .swap img {
  width: 33%;
  height: auto;
}

/********** おすすめスライダー **********/
.populer_fx {
  padding: 10px 10px 15px;
}
.populer_fx_h3 img {
  width: 100%;
}
.populer_fx_wrapper h4 {
  background-color: #ff2d55;
  color: white;
  font-size: 1rem;
  width: calc(100% - 10px);
  margin: 5px auto;
  padding: 5px 0px;
  text-align: center;
  position: relative;
  height: 27px;
}
.populer_fx_box {
  display: flex;
  justify-content: space-around;
  width: 100%;
  margin: 0 auto;
}
.populer_fx_box_list {
  width: 32%;
  position: relative;
  text-align: center;
  margin-top: 6px;
}
.populer_fx_box_list_recommend {
  width: 100%;
}
.populer_fx_box_list_recommend img {
  width: 100%;
}
.populer_fx_box_list a:hover {
  opacity: 0.8;
  display: block;
}
.populer_fx_box_list h5 {
  color: #222;
  font-size: 1rem;
  text-align: center;
  padding: 0;
  margin: 0;
  border: 1px dotted #a27f00;
  padding: 3px;
}
.populer_fx_box_list h5 img {
  max-width: 100%;
  height: 26px;
  margin: 3px 0px;
  display: inline;
}
.populer_fx_box_list_img img {
  margin: 3px auto 5px;
  text-align: center;
  display: block;
}
.populer_fx_box_list p {
  font-size: 1.4rem;
  color: rgb(255, 45, 85);
  font-weight: 600;
}

.main_section {
  display: flex;
  justify-content: space-around;
  margin-top: 30px;
}
.main_section h3 {
  font-size: 2rem;
  position: relative;
  color: #222;
}
.main_section h3:before {
  display: inline-block;
  width: 20px;
  position: absolute;
  left: 0;
}

/******  スライダー　*******/
.slick-slide {
  height: auto !important;
  align-self: stretch;
}
.slick-slide div {
  height: 190px;
  margin-right: 8px;
}
.slick-slide div.populer_fx_box_list {
  display: flex !important;
  justify-content: center;
  align-items: flex-end;
  justify-content: center;
}
.slick-slide div.populer_fx_box_list_img {
  display: flex !important;
  justify-content: center;
  align-items: normal;
  flex-wrap: wrap;
  height: 150px;
  margin-right: 0px;
}
.slick-slide div.populer_fx_box_list a {
  width: 100%;
  height: -webkit-fill-available;
  flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: end;
}
.slick-slide div.populer_fx_box_list a img {
  height: auto;
  margin: 10px 5px 7px;
  width: 90%;
  margin-top: auto;
}
.slick-slide .populer_fx_box button {
  position: absolute;
}

/***********************************************/
/*******************  検索結果  *****************/
/***********************************************/
.page-template-page-search .fxsearch {
  margin-top: 50px;
}
.page-template-page-search .result {
  border-radius: 10px;
  background-color: #e9ebfd;
  padding: 16px;
  width: 96%;
  min-width: 300px;
  margin: 60px auto 10px;
  overflow: hidden;
}
.page-template-page-search .result_title {
  margin-bottom: 10px;
  border-bottom: 1px dotted #222;
  padding-bottom: 6px;
  display: flex;
}
.page-template-page-search .result_title b {
  font-size: 20px;
  margin-right: 20px;
}
.page-template-page-search .result_title div#move_search {
  background-color: #3f6ec2;
  border-radius: 4px;
  color: #fff;
  padding: 2px 42px 2px 8px;
  align-items: center;
  display: flex;
  transition: 0.3s all;
  position: relative;
  font-size: 12px;
}
.page-template-page-search .result_title div#move_search::after {
  content: "";
  background-image: url(../img/common/arrow-search.svg);
  width: 13px;
  height: 13px;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  right: 3px;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
.page-template-page-search .result_title div#move_search:hover {
  background-color: #1f80e0;
  transition: 0.3s all;
}
.page-template-page-search .result .option li {
  border-radius: 4px;
  border: 1px dotted #222;
  padding: 2px 8px;
  font-size: 13px;
  display: inline-block;
  margin: 3px;
}
.page-template-page-search .filter {
  display: flex;
  justify-content: end;
  align-items: center;
  width: 96%;
  margin-bottom: 40px;
}
.page-template-page-search .filter .title {
  margin-right: 10px;
  font-size: 1.3rem;
}
.page-template-page-search .filter-box {
  position: relative;
}
.page-template-page-search .filter-box::before, .page-template-page-search .filter-box::after {
  position: absolute;
  content: "";
  pointer-events: none;
}
.page-template-page-search .filter-box::before {
  display: inline-block;
  right: 0;
  width: 30px;
  height: 32px;
  border-radius: 0 3px 3px 0;
  background-color: #3f6ec2;
}
.page-template-page-search .filter-box::after {
  position: absolute;
  top: 47%;
  right: 14px;
  transform: translate(50%, -50%) rotate(45deg);
  width: 8px;
  height: 8px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
}
.page-template-page-search .filter-box select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  min-width: 180px;
  padding: 6px 30px 6px 10px;
  border: none;
  height: 32px;
  border-radius: 3px;
  background-color: #f5f5f5;
  color: #333;
  font-size: 1.4rem;
  cursor: pointer;
}
.page-template-page-search .filter-box select:focus {
  outline: 2px solid #2589d0;
}

.read02 {
  display: block;
  text-align: center;
}
.read02 p {
  margin: 10px 20px 0px;
}

.howto img.center {
  width: 100%;
  max-width: 600px;
}

.main {
  display: flex;
  width: calc(100% - 20px);
  margin: 30px auto 0px;
}

#innerpage .mv {
  width: calc(100% - 20px);
  padding: 20px 0px;
  height: auto;
}

#innerpage .main_left h3 {
  font-size: 2rem;
  margin-left: 10px;
  letter-spacing: 0px;
}

.img_centerbox {
  width: 100%;
}

.displayflex {
  display: block;
}
.displayflex img {
  width: 100%;
}

.ranking_title {
  font-size: 2.2rem;
  letter-spacing: 0px;
}

.leverage {
  margin: 0px 0px 50px;
}
.leverage h4 {
  padding: 4px 8px;
  display: inline-block;
  background-color: #ffe8e8;
  width: 100%;
}

.inner_main {
  padding: 0px 10px;
}
.inner_main p {
  font-size: 1.5rem;
}

/**************************************/
/************ inner page *************/
/**************************************/
.mv-review-wrapper {
  background-color: #19bed1;
}

.mv-howto-wrapper {
  background-color: #2363ac;
}

.mv-small-wrapper {
  background-color: #8ae8ff;
}

/***********************************************/
/*****************  お問い合わせ  ****************/
/***********************************************/
.page-template-page-contact {
  background-color: #f4f5f7 !important;
}
.page-template-page-contact .header-container {
  display: none !important;
}
.page-template-page-contact footer {
  display: none !important;
}
.page-template-page-contact .content {
  margin-top: 24px;
}
.page-template-page-contact .content .content-in {
  width: 100%;
  max-width: 768px;
}
.page-template-page-contact .content .content-in .main {
  padding: 20px 29px !important;
}
.page-template-page-contact .content .content-in .main h1 {
  color: #333333;
}
.page-template-page-contact .content .content-in .main input[type=submit] {
  text-align: center;
}

/***********************************************/
/******************   調査結果  *****************/
/***********************************************/
.research {
  padding: 0px 20px;
}
.research h2 {
  font-size: 20px;
  margin: 30px 0px;
  border-bottom: 1px solid #222;
}
.research h3 {
  font-size: 16px;
}
.research p {
  font-size: 14px;
  line-height: 150%;
  margin-bottom: 40px;
}
.research dl {
  line-height: 19px;
  font-size: 14px;
  margin-bottom: 40px;
}
.research dt {
  font-weight: 400;
  float: left;
}
.research dd {
  margin-left: 125px;
}

/***********************************************/
/*******************  運営情報  *****************/
/***********************************************/
.about {
  display: block;
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
  background-color: #fff;
  padding: 0px 20px;
}
.about h2 {
  font-size: 20px;
  margin: 30px 0px;
  border-bottom: 1px solid #222;
}
.about dt {
  width: 100%;
  font-weight: 400;
  padding: 5px 0 5px 10px;
  background-color: #efefef;
}
.about dd {
  width: 100%;
  padding: 5px 0 5px 10px;
  margin: 0px;
}

/***********************************************/
/*******************  利用規約  *****************/
/***********************************************/
.terms {
  width: 100%;
  max-width: 960px;
  padding: 0px 20px;
}
.terms h2 {
  font-size: 20px;
  margin: 30px 0px;
  border-bottom: 1px solid #222;
}
.terms h3 {
  font-size: 18px;
}
.terms p {
  font-size: 14px;
  margin-bottom: 30px;
}

/***********************************************/
/*******************  FXの学び方  ***************/
/***********************************************/
.study {
  margin-top: 20px;
  scroll-padding-top: 70px;
}
.study div {
  line-height: 170%;
}
.study .mv-wrapper {
  margin-top: 20px;
  background-color: #38b99a;
}
.study .mv {
  width: 100%;
  height: auto;
}
.study-mv {
  width: 100%;
}
.study .panNav {
  font-size: 12px;
  margin-top: 20px;
  display: flex;
  gap: 6px;
}
.study h3 {
  background-color: #dbfff2;
  text-align: center;
  height: auto;
  padding: 10px 10px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  margin: 10px 0px 20px 0px;
}
.study h4 {
  font-size: 22px;
  text-align: center;
  margin: 40px 0px 50px 0px;
  position: relative;
  padding-top: 50px;
  line-height: 120%;
  color: #2196f3;
  border-top: 1px solid #e3e3e3;
}
.study h4::after {
  content: "";
  width: 30px;
  height: 3px;
  display: inline-block;
  background-color: #2196f3;
  position: absolute;
  bottom: -16px;
  left: calc(50% - 15px);
}
.study h5 {
  font-size: 16px;
  margin: 20px 0px 10px 0px;
  color: #414141;
  padding: 3px 0px 4px 10px;
  background-color: #e8ffe6;
}
.study h6 {
  padding-bottom: 1px;
  border-bottom: 1px dotted #222;
  display: block;
  margin-bottom: 5px;
}
.study img {
  width: auto;
  max-width: 100%;
}
.study p {
  font-size: 15px;
  line-height: 170%;
}
.study span.small {
  font-size: 10px;
}
.study-wrapper {
  margin: 20px 10px 0px;
}
.study-wrapper b {
  font-weight: 600;
  color: #f06e6e;
}
.study-wrapper-margin {
  margin: 0px 10px;
}
.study-btn {
  font-size: 16px;
  font-weight: bold;
  border-radius: 10px;
  border: 1px solid #ced6e1;
  box-shadow: 0px 2px 0px #e4eaf2;
  margin: 12px 0px;
  height: 63px;
  align-items: center;
  display: flex;
  position: relative;
  display: block;
  width: 100%;
  background-image: url("../img/study/bg.png"), linear-gradient(to bottom, #ffffff, #eff6ff);
  background-repeat: no-repeat, no-repeat;
  background-position: left top, top;
  background-size: auto 100%, 100% 100%;
}
.study-btn a {
  color: #5a5a5a;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  text-decoration: none;
}
.study-btn a b {
  color: #33598f;
  line-height: 120%;
}
.study-btn a img {
  width: 24px;
  margin-left: 10px;
}
.study-btn:after {
  content: "";
  background-image: url(../img/study/study-btn-arrow.svg);
  background-size: contain;
  width: 8px;
  height: 14px;
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}
.study .btn-title {
  font-size: 15px;
  text-align: left;
  padding-bottom: 7px;
  color: #474747;
  border-bottom: 1px solid #e0e0e0;
  padding-left: 10px;
  margin-top: 60px;
}
.study .studyBtn {
  border: 2px solid #b3f2ae;
  background-color: #d0ffcc;
  padding: 20px 12px;
  border-radius: 10px;
  margin: 90px 0px 40px;
  position: relative;
}
.study .studyBtn .try {
  position: absolute;
  width: 200px;
  top: -35px;
  left: calc((100% - 172px) / 2);
  width: 172px;
}
.study .open {
  display: block;
  margin: 0px auto;
  text-align: center;
}
.study .demo {
  display: block;
  margin: 20px auto 0px;
  text-align: center;
}
.study ul {
  background-color: #fff3f3;
  padding: 10px 16px;
  margin: 10px 0px;
}
.study ul.number {
  list-style: decimal !important;
  list-style-type: decimal !important;
}
.study ul li {
  display: block;
  line-height: 150%;
  margin: 5px 0px;
  padding-top: 5px;
  font-weight: 600;
  line-height: 160%;
  border-top: 1px dotted #efd3d3;
}
.study ul li:first-child {
  padding-top: 0px;
  border-top: 0px;
}
.study ul li p {
  color: #2196f3;
  text-decoration: underline;
  position: relative;
  padding: 0 0 0 16px;
}
.study ul li p::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  border: 4px solid transparent;
  border-left: 7px solid #329cf3;
}
.study ol {
  background-color: #fff3f3;
  padding: 10px 16px 10px 25px;
  margin: 10px 0px;
  list-style: decimal !important;
  list-style-type: decimal !important;
}
.study ol li {
  line-height: 150%;
}
.study .stepBox {
  margin: 20px auto;
  text-align: center;
}
.study .stepBox img {
  max-width: 200px;
  margin: 10px 0px;
}
.study .technique-title {
  margin: 20px -10px 10px;
}

.page-template-study-page footer {
  display: none !important;
}

/*キラッと光る*/
@keyframes shine {
  0% {
    left: -20%;
  }
  10% {
    left: 130%;
  }
  100% {
    left: 130%;
  }
}
.btnshine {
  position: relative;
  display: block;
  width: 100%;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
}

.btnshine::after {
  content: "";
  position: absolute;
  top: -10%;
  left: -20%;
  width: 40px;
  height: 100%;
  transform: scale(2) rotate(20deg);
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.5) 100%, rgba(255, 255, 255, 0) 0%);
  animation-name: shine;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

@keyframes shine {
  100% {
    left: 125%;
  }
}
/***********************************************/
/*****************  殿堂入り  ****************/
/***********************************************/
.award {
  border: 2px solid #3f51b5;
  position: relative;
  margin: 30px 10px 5px;
}
.award_title {
  background-color: #3f51b5;
  padding: 10px 0 10px 16px;
}
.award_title_box {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 20px;
  color: #fff;
}
.award_title_box img {
  width: 45px;
}
.award_title_box_right h4 {
  line-height: 100%;
  font-size: 14px;
  color: #c4ae3f;
  margin-bottom: 2px;
}
.award_title_box_right h5 {
  font-size: 20px;
  line-height: 100%;
}
.award_services .service {
  background-color: #fff;
  border: 0px;
  margin: 0px;
}
.award_services .service h4 {
  background-color: #272727;
  margin: 10px;
}
.award_services .service h4 img {
  display: none;
}

.app_only {
  display: none !important;
}

.web_only {
  display: none !important;
}

/***************:  CSS追加　smallセクション **************/
.bg-gray {
  background-color: #fafaff;
  padding-top: 20px;
  padding-bottom: 1px;
}

p.bg-white {
  background-color: #fff;
  padding: 16px;
  line-height: 170%;
  border: 1px solid #f2f2f2;
}

/***************: app_bannerセクション **************/
.app_banner_content {
  border-radius: 10px;
  box-shadow: 0px 7px 10px #d7d7d7;
  position: relative;
  margin: 30px 0px 20px;
  border: 3px solid #696be3;
  background-color: #696be3;
  padding: 0px;
  overflow: hidden;
}
.app_banner_content h2 {
  background-color: #0f7813;
  border-radius: 23px;
  padding: 3px 29px 3px 22px;
  font-size: 17px;
  color: #fff;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: -19px;
  left: 0;
  display: flex;
  gap: 7px;
  width: 240px;
  right: 0;
}
.app_banner_content h2 img {
  width: 18px;
}
.app_banner_content_free {
  background-color: #feffdc;
  border-top-left-radius: 10px;
  padding: 2px 0px 0px;
  border-top-right-radius: 10px;
}
.app_banner_content_free img {
  margin: 7px auto 0px;
  display: block;
  width: 92%;
}
.app_banner_content_img {
  background-color: #feffdc;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  overflow: hidden;
  border: 0px;
}
.app_banner_content_img img {
  width: 100%;
  vertical-align: middle;
  border: 0px;
}
.app_banner_content_name {
  padding-bottom: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding-left: 10px;
  background-color: #feffdc;
}
.app_banner_content_name .icon {
  width: 50px;
}
.app_banner_content_name .icon img {
  width: 100%;
  border: 1px solid #3f6ec2;
}
.app_banner_content_name h3 {
  margin: 0px;
  font-size: 2.3rem;
  color: #503d76;
  font-weight: bold;
}
.app_banner_content_badge {
  display: flex;
  gap: 10px;
  margin: 10px;
  width: calc(100% - 50px);
}
.app_banner_content_badge a {
  width: calc(50% - 5px);
}

.app_banner {
  background-color: #f4f4f4;
  padding: 0px 20px 6px;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
@media screen and (max-width: 380px) {
  .app_banner {
    padding: 20px 10px;
  }
}
.app_banner div.banner_container {
  width: 100%;
  max-width: 500px;
  align-items: center;
  -moz-column-gap: 20px;
       column-gap: 20px;
  border: 1px dotted;
  position: relative;
  margin-top: 10px;
  border-radius: 2px;
  position: relative;
  background-color: #cfbdff;
}
.app_banner p {
  display: inline-block;
  height: 31px;
  line-height: 31px;
  padding: 0 1rem;
  background-color: #673ab7;
  color: #fff;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  width: 250px;
  margin: 0 auto;
  display: block;
  position: relative;
  top: -15px;
  left: 0px;
}
.app_banner p::before,
.app_banner p::after {
  position: absolute;
  top: 0;
  width: 0px;
  height: 0px;
  border-color: #673ab7 transparent;
  border-style: solid;
  content: "";
}
.app_banner p::before {
  left: -9px;
  border-width: 16px 0px 15px 9px;
}
.app_banner p::after {
  right: -8px;
  border-width: 16px 9px 15px 0px;
}
.app_banner div.img_box {
  gap: 0px;
  margin: 0px 10px 5px 10px;
  display: flex;
  justify-content: center;
  top: -6px;
  position: relative;
}
.app_banner div.img_box img {
  width: 150px;
  min-width: 150px;
}

.study .app_banner {
  padding: 20px 10px 20px 20px;
}
.study .app_banner .app_banner_content {
  margin: 0;
}

/*********   広告枠  *********/
.ad {
  margin: 20px;
}

.ad-p {
  background-color: #33399d;
  text-align: center;
  color: #fff;
  padding: 10px 0px;
  font-size: 2rem;
}

.ad a {
  display: block;
  padding: 20px;
  border: 1px solid #33399d;
  background-color: #f8fcff;
}
.ad a img {
  width: 90%;
  max-width: 340px;
  margin: 0px auto;
  display: block;
}

.populer_fx_box.slick-initialized {
  display: block;
}

/*********   離脱防止モーダル  *********/
.back-modal {
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10000;
}

.back-modal-bg {
  background: rgba(0, 0, 0, 0.8);
  height: 100vh;
  position: absolute;
  width: 100%;
}

.back-modal-content {
  position: absolute;
  width: 300px;
  height: auto;
  background-color: #fefedc;
  border-radius: 20px;
  z-index: 6;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.back-modal-content h2 {
  background-color: #0f7813;
  border-radius: 23px;
  padding: 6px 23px 6px 22px;
  font-size: 18px;
  color: #fff;
  display: block;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: -20px;
  left: 36px;
  display: flex;
  gap: 7px;
}
.back-modal-content h2 img {
  width: 18px;
}
.back-modal-content-free {
  background-color: #c7ecae;
  border-top-left-radius: 20px;
  padding: 21px 0px 9px;
  border-top-right-radius: 20px;
}
.back-modal-content-name {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px;
  gap: 10px;
  border-bottom: 1px dashed #bebcbc;
  padding-bottom: 10px;
}
.back-modal-content-name .icon {
  width: 50px;
}
.back-modal-content-name .icon img {
  width: 100%;
  border: 1px solid #3f6ec2;
}
.back-modal-content-name h3 {
  margin: 0px;
  font-size: 2.3rem;
  color: #3f6ec2;
  font-weight: bold;
}
.back-modal-content-badge {
  display: flex;
  gap: 10px;
  margin: 10px;
}
.back-modal-content-badge a {
  width: calc(50% - 5px);
}

.back-modal .button {
  font-size: 12px;
  background-color: #fff;
  position: absolute;
  bottom: -36px;
  color: #222;
  left: 40%;
  padding: 3px 10px;
  border-radius: 2px;
}
.back-modal .button a {
  color: #222;
}

.must-txt {
  margin: 30px 10px 10px 10px;
}
.must-txt img {
  width: 100%;
}

/*********   scroll-hint  *********/
.scroll-hint-icon-wrap {
  z-index: 5;
}

.scroll-hint-icon {
  opacity: 1;
}

.scroll-hint-icon.hide {
  opacity: 0;
}

.js-scrollable::-webkit-scrollbar {
  display: none;
}

/********************   初心者のためのFXガイド　*************************/
.beginner_guide {
  margin: 10px;
}
.beginner_guide_title img {
  display: block;
  margin: 0 auto;
}
.beginner_guide_box {
  margin-top: 10px;
}
.beginner_guide_change {
  background-color: #fff;
  display: flex;
  align-items: center;
  text-align: center;
  line-height: 2rem;
  font-weight: 600;
  gap: 4px;
  display: flex;
  flex-direction: row;
}
.beginner_guide_change_btn {
  border-top: 2px solid #58a975;
  border-left: 2px solid #58a975;
  border-right: 2px solid #58a975;
  flex: 1;
  height: 50px;
  line-height: 110%;
  color: #59aa75;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  font-size: 1.6rem;
  font-weight: 600;
}
.beginner_guide_change_btn.active {
  opacity: 1;
  color: #42684f;
}
.beginner_guide_change .active {
  background-color: #aaf5c2;
}
.beginner_guide_panel {
  padding: 10px;
  border: 3px solid #58a975;
  display: none;
  line-height: 150%;
}
.beginner_guide_panel.active {
  display: block;
}
.beginner_guide_panel img {
  max-height: 110px;
  display: block;
  text-align: center;
  margin: 0 auto;
}
.beginner_guide_panel span.small {
  font-size: 1.1rem;
}
.beginner_guide_panel .btn_app {
  background-color: #fff9be;
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
  position: relative;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.15);
  padding: 12px;
}
.beginner_guide_panel .btn_app span {
  display: block;
  text-align: center;
  font-size: 1.6rem;
}
.beginner_guide_panel .btn_app_right {
  width: 100%;
}
.beginner_guide_panel .btn_app_right_title {
  width: 190px;
  text-align: center;
  margin: 0 auto;
  padding-bottom: 5px;
}
.beginner_guide_panel .btn_app_right_title img {
  width: 100%;
}
.beginner_guide_panel .btn_app_right_box {
  display: flex;
  gap: 10px;
}
.beginner_guide_panel .btn_app_right_box a {
  width: 100%;
}
.beginner_guide_panel .btn_app_right_box a img {
  flex: 1;
  width: calc(100% - 5px);
}
.beginner_guide .btn {
  margin: 40px auto 0px;
  padding: 15px 20px;
  text-align: center;
  border-radius: 60px;
  display: block;
  max-width: 300px;
  font-size: 1.8rem;
  border-bottom: 5px solid #c43636;
}
.beginner_guide .btn .shine {
  position: absolute;
  width: 100%;
  overflow: hidden;
  height: 100%;
  top: 0px;
  left: 0px;
}
.beginner_guide .btn .shine::after {
  animation: 4s 0s shine linear infinite;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%);
  content: "";
  height: 100%;
  left: -100%;
  position: absolute;
  top: 0;
  transform: skewX(-25deg);
  width: 50%;
}
@keyframes shine {
  20% {
    left: 150%;
  }
  100% {
    left: 150%;
  }
}
.beginner_guide .btn div.txt {
  position: absolute;
  top: -24px;
  left: 83px;
}
.beginner_guide .btn div.txt span {
  display: block;
  text-align: center;
  font-size: 1.6rem;
  color: #ff6c3f;
}
.beginner_guide .btn div.txt span:before {
  content: "";
  display: inline-block;
  background: #ff6c3f;
  width: 2px;
  height: 13px;
  transform: translateY(0.2em) rotate(-25deg);
  position: absolute;
  left: -10px;
  top: 3px;
}
.beginner_guide .btn div.txt span:after {
  content: "";
  display: inline-block;
  background: #ff6c3f;
  width: 2px;
  height: 13px;
  transform: translateY(0.2em) rotate(25deg);
  position: absolute;
  right: -10px;
  top: 3px;
}

.theme_recommend {
  margin: 20px 0px 40px 0px;
}
.theme_recommend_wrapper {
  max-width: 440px;
  margin: 0 auto 0px;
  padding: 0px 16px;
}
.theme_recommend .title {
  margin: 10px 10px 20px 10px;
}

.recommend_ad,
.trading_tool_ad {
  border: 3px solid #c78626;
  background-color: #fef9e8;
}

.small_amount_ad {
  border: 3px solid #357c82;
  background-color: #f1feff;
}

.highly_recommend_ad,
.low_fee_ad {
  border: 3px solid #0f7915;
  background-color: #f8fffa;
}

.auto_banner_ad {
  border: 3px solid #bbba0a;
  background-color: #fffeed;
}

.highly_recommend_ad,
.recommend_ad,
.low_fee_ad,
.small_amount_ad,
.auto_banner_ad,
.trading_tool_ad {
  border-radius: 10px;
  display: flex;
  gap: 10px;
  margin: 20px 0px 27px 0px;
  padding: 30px 10px 10px;
  position: relative;
  align-items: center;
}
.highly_recommend_ad img.recommend_ad_title,
.recommend_ad img.recommend_ad_title,
.low_fee_ad img.recommend_ad_title,
.small_amount_ad img.recommend_ad_title,
.auto_banner_ad img.recommend_ad_title,
.trading_tool_ad img.recommend_ad_title {
  position: absolute;
  top: 4px;
  left: 50%;
  width: 250px;
  transform: translate(-50%, -50%);
}
.highly_recommend_ad_left img,
.recommend_ad_left img,
.low_fee_ad_left img,
.small_amount_ad_left img,
.auto_banner_ad_left img,
.trading_tool_ad_left img {
  width: 130px;
}
.highly_recommend_ad_right,
.recommend_ad_right,
.low_fee_ad_right,
.small_amount_ad_right,
.auto_banner_ad_right,
.trading_tool_ad_right {
  width: calc(100% - 140px);
}
.highly_recommend_ad_right a.ad_title,
.recommend_ad_right a.ad_title,
.low_fee_ad_right a.ad_title,
.small_amount_ad_right a.ad_title,
.auto_banner_ad_right a.ad_title,
.trading_tool_ad_right a.ad_title {
  display: flex;
  justify-content: center;
  font-size: 1.5rem;
  padding-bottom: 4px;
  font-weight: bold;
  line-height: 110%;
}
.highly_recommend_ad_right p,
.recommend_ad_right p,
.low_fee_ad_right p,
.small_amount_ad_right p,
.auto_banner_ad_right p,
.trading_tool_ad_right p {
  display: block;
  line-height: 1.7rem;
  font-weight: 600;
  margin-bottom: 10px;
  font-size: 1.3rem;
  padding: 0px 5px;
}
.highly_recommend_ad_right .btn,
.recommend_ad_right .btn,
.low_fee_ad_right .btn,
.small_amount_ad_right .btn,
.auto_banner_ad_right .btn,
.trading_tool_ad_right .btn {
  padding: 0px;
  height: 33px;
  width: 100%;
}
.highly_recommend_ad_right .btn a,
.recommend_ad_right .btn a,
.low_fee_ad_right .btn a,
.small_amount_ad_right .btn a,
.auto_banner_ad_right .btn a,
.trading_tool_ad_right .btn a {
  height: 32px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  -moz-column-gap: 6px;
       column-gap: 6px;
  padding: 0 10px 0px 0px;
}
.highly_recommend_ad_right .btn a span,
.recommend_ad_right .btn a span,
.low_fee_ad_right .btn a span,
.small_amount_ad_right .btn a span,
.auto_banner_ad_right .btn a span,
.trading_tool_ad_right .btn a span {
  font-size: 1.6rem;
  flex-shrink: 0;
}
.highly_recommend_ad_right .btn a span.space,
.recommend_ad_right .btn a span.space,
.low_fee_ad_right .btn a span.space,
.small_amount_ad_right .btn a span.space,
.auto_banner_ad_right .btn a span.space,
.trading_tool_ad_right .btn a span.space {
  width: 18px;
  flex-shrink: 1;
}
.highly_recommend_ad_right .btn a img,
.recommend_ad_right .btn a img,
.low_fee_ad_right .btn a img,
.small_amount_ad_right .btn a img,
.auto_banner_ad_right .btn a img,
.trading_tool_ad_right .btn a img {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.campaign_wrapper {
  background-color: #fffb90;
  border: #fffb90;
  position: relative;
  padding: 30px 0px 10px;
  line-height: 2.2rem;
  text-align: center;
  margin: 20px 10px;
  border: 2px dotted #2b2ec5;
  border-radius: 10px;
}
.campaign_wrapper_title {
  position: absolute;
  width: 250px;
  top: -1px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.campaign_wrapper_txt {
  font-size: 1.7rem;
  font-weight: 600;
}
.campaign_wrapper_txt span {
  color: red;
}

#sidejob .mv-wrapper {
  background: none;
}
#sidejob .top-explanation {
  padding: 10px;
  background-color: #f6fff2;
}
#sidejob .top-explanation b {
  background-color: #fff596;
}
#sidejob h3.recommend-ranking {
  background-color: #e4ffe5;
  text-align: center;
  padding: 7px;
  color: #016505;
  margin: 20px 10px 10px;
}
#sidejob .simple_service {
  border-radius: 6px;
  margin: 10px;
  padding: 4px 8px 4px;
  background-color: #fff;
  box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.18);
}
#sidejob .simple_service .service {
  border: 0px;
  margin-bottom: 45px;
  padding-bottom: 0px;
  position: relative;
  margin: 0px;
}
#sidejob .simple_service .service .btn {
  width: 96%;
  margin: 16px auto 0px;
}
#sidejob .simple_service .service .btn a {
  padding: 33px 0px 6px;
}
#sidejob .simple_service .service .btn span.btn-atention {
  line-height: 110%;
  border-radius: 36px;
  width: 178px;
  top: 8%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
}
#sidejob .simple_service .service .btn span.btn-atention:before {
  content: none;
}
#sidejob .simple_service .service .btn span.btn-atention::after {
  content: none;
}
#sidejob .simple_service .service .btn .btn-site img {
  margin-right: 10px;
}
#sidejob .simple_service .service .btn b {
  font-size: 1.5rem;
  color: #fff;
  border-bottom: 0px;
}
#sidejob .simple_service .service .btn .btn-site {
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding-left: 0px;
}
#sidejob .simple_service b {
  font-size: 1.8rem;
  color: #222;
  border-bottom: 1px solid #d8d8d8;
  width: 100%;
  display: block;
}
#sidejob .simple_service_content {
  display: flex;
  flex-direction: row;
  -moz-column-gap: 8px;
       column-gap: 8px;
  margin-top: 5px;
}
#sidejob .simple_service_content_left {
  width: 34%;
}
#sidejob .simple_service_content_right {
  width: 66%;
}
#sidejob .simple_service_content_right a {
  font-size: 1.8rem;
}
#sidejob .simple_service ul {
  margin-top: 6px;
}
#sidejob .simple_service ul li {
  font-size: 1.1rem;
  line-height: 120%;
  position: relative;
  padding-left: 12px;
  margin-bottom: 3px;
  font-weight: 600;
}
#sidejob .simple_service ul li::before {
  content: "";
  width: 10px;
  height: 8px;
  top: 1px;
  display: inline-block;
  left: -1px;
  background-image: url(../img/common/checkbox.svg);
  background-size: contain;
  vertical-align: middle;
  position: absolute;
}
#sidejob .service_show_more_box {
  margin: 20px auto;
}
#sidejob .service_show_more_box .service_show_more_button {
  padding: 10px 30px 10px 17px;
}
#sidejob .whysidejob {
  background-color: #fff;
  padding: 10px 16px 30px;
}
#sidejob .whysidejob h2 {
  font-size: 5.7vw;
  margin: 20px auto 30px;
  text-align: center;
  position: relative;
}
#sidejob .whysidejob h2::after {
  content: "";
  width: 329px;
  height: 14px;
  position: absolute;
  bottom: -18px;
  left: 17px;
  background-size: contain;
  background-image: url(../img/sidejob/reason.png);
}
#sidejob .whysidejob h3 {
  background-color: #ff5b5b;
  color: #fff;
  border-radius: 4px;
  margin: 50px 0px 20px 0px;
  font-size: 17px;
  position: relative;
  overflow: hidden;
  text-align: center;
  padding: 10px 0px;
  line-height: 130%;
}
#sidejob .whysidejob h3 span {
  z-index: 3;
  position: relative;
}
#sidejob .whysidejob h3 b {
  background-color: #ffe974;
  color: #e33131;
  font-weight: 600;
  z-index: 3;
  position: relative;
}
#sidejob .whysidejob h3 b:after {
  content: "";
  display: block;
  background-size: cover;
  background-image: url(../img/sidejob/shining01.png);
  width: 13px;
  height: 14px;
  position: absolute;
  right: 163px;
  top: -7px;
}
#sidejob .whysidejob h3 b:before {
  content: "";
  display: block;
  background-size: cover;
  background-image: url(../img/sidejob/shining02.png);
  width: 10px;
  height: 12px;
  position: absolute;
  left: 162px;
  top: 10px;
}
#sidejob .whysidejob div.h3-bg {
  content: "";
  background-size: contain;
  background-image: url(../img/sidejob/h3-bg.png);
  top: 50%;
  left: 68%;
  position: absolute;
  transform: translateY(-50%) translateX(-50%);
  width: 120%;
  height: 100%;
}
#sidejob .whysidejob p b {
  background-color: #fff596;
}
#sidejob .whysidejob span.redline {
  border-bottom: 3px solid red;
  font-weight: 600;
}
#sidejob .theme_recommend {
  margin: 30px 0px 40px 0px;
}
#sidejob #s-s-small {
  background: #fc6a6c;
  background: linear-gradient(#fc6a6c, #ffad7b);
  padding: 20px 0px 2px;
  border-radius: 10px;
  margin: 20px 10px;
}
#sidejob #s-s-small h3 {
  background: none;
  margin: 0px;
  font-size: 2rem;
  padding: 0px;
  line-height: 120%;
  color: #fff;
  text-align: center;
}
#sidejob #s-s-spread {
  background: #2697ff;
  background: linear-gradient(#2697ff, #6cb9ff);
  padding: 20px 0px 2px;
  border-radius: 10px;
  margin: 20px 10px;
}
#sidejob #s-s-spread h3 {
  background: none;
  margin: 0px;
  padding: 0px;
  font-size: 2rem;
  text-align: center;
  line-height: 120%;
  color: #fff;
}
#sidejob #s-s-swap {
  background: #d0b702;
  background: linear-gradient(#e2cb21, #ffe683);
  padding: 20px 0px 2px;
  border-radius: 10px;
  margin: 20px 10px;
}
#sidejob #s-s-swap h3 {
  background: none;
  margin: 0px;
  padding: 0px;
  font-size: 2rem;
  text-align: center;
  line-height: 120%;
  color: #fff;
  text-shadow: #e2cb21 1px 0 10px;
}
#sidejob #s-s-demotrade {
  background: #fc6a6c;
  background: linear-gradient(#fc6a6c, #ffad7b);
  padding: 20px 0px 2px;
  border-radius: 10px;
  margin: 20px 10px;
}
#sidejob #s-s-demotrade h3 {
  background: none;
  margin: 0px;
  padding: 0px;
  font-size: 2rem;
  text-align: center;
  line-height: 120%;
  color: #fff;
}
#sidejob #s-s-auto {
  background: #2697ff;
  background: linear-gradient(#2697ff, #6cb9ff);
  padding: 20px 0px 2px;
  border-radius: 10px;
  margin: 20px 10px;
}
#sidejob #s-s-auto h3 {
  background: none;
  margin: 0px;
  padding: 0px;
  font-size: 2rem;
  text-align: center;
  line-height: 120%;
  color: #fff;
}
#sidejob .app-wrapper {
  margin: 50px 10px;
  background-color: #fefff3;
  border: 3px dotted #696be3;
}
#sidejob .app_banner {
  background-color: #fefff3;
}
#sidejob .app_banner_content {
  margin: 0px 0px 20px;
}
#sidejob .app_title {
  padding: 20px 15px 10px;
  font-weight: 600;
  font-size: 1.5rem;
  text-align: left;
  font-weight: normal;
  line-height: 125%;
}
#sidejob .app_title b {
  background-color: yellow;
}
#sidejob .app_title ul {
  padding: 3px 0px;
}
#sidejob .app_title ul li {
  font-weight: 600;
  position: relative;
  margin-left: 14px;
  padding-bottom: 7px;
  line-height: 140%;
}
#sidejob .app_title ul li span {
  border-bottom: 3px solid red;
  font-weight: 600;
}
#sidejob .app_title ul li::before {
  content: "■";
  top: -2px;
  display: inline-block;
  left: -13px;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
}

/*********   single-table  *********/
.compare #compare-panel01 th:nth-child(1),
.compare #compare-panel01 td:nth-child(1) {
  width: 50px !important;
}
.compare #compare-panel01 th:nth-child(2),
.compare #compare-panel01 td:nth-child(2) {
  z-index: 4;
  background-color: white;
  position: sticky;
  left: 0px;
  padding: 4px 10px;
  width: 120px;
}
.compare #compare-panel01 th:nth-child(3),
.compare #compare-panel01 td:nth-child(3) {
  width: 55px;
}
.compare #compare-panel01 th:nth-child(4),
.compare #compare-panel01 td:nth-child(4) {
  width: 55px;
}
.compare #compare-panel01 th:nth-child(5),
.compare #compare-panel01 td:nth-child(5) {
  width: 55px;
}
.compare #compare-panel01 th:nth-child(6),
.compare #compare-panel01 td:nth-child(6) {
  width: 55px;
  text-align: center;
}
.compare #compare-panel01 th:nth-child(7),
.compare #compare-panel01 td:nth-child(7) {
  width: 55px;
}
.compare #compare-panel01 th:nth-child(8),
.compare #compare-panel01 td:nth-child(8) {
  width: 80px;
}
.compare #compare-panel01 th:nth-child(9),
.compare #compare-panel01 td:nth-child(9) {
  width: 80px;
}
.compare #compare-panel01 th:nth-child(10),
.compare #compare-panel01 td:nth-child(10) {
  width: 260px;
  padding: 5px;
}
.compare #compare-panel01 th:nth-child(11),
.compare #compare-panel01 td:nth-child(11) {
  width: 52px;
}
.compare #compare-panel01 th:nth-child(12),
.compare #compare-panel01 td:nth-child(12) {
  width: 70px;
}
.compare #compare-panel01 td a {
  font-size: 1.2rem;
}
.compare #compare-panel01 td:nth-child(1) {
  z-index: 4;
  padding: 0px 2px;
  background-color: #fff;
  width: 50px;
  color: #3f6ec2;
}
.compare #compare-panel01 td span.click-move {
  color: #1873c4;
  border-bottom: 1px solid #1873c4;
}
.compare #compare-panel01 td span.click-move:hover {
  color: #e53900;
}
.compare #compare-panel01 td img.circle {
  width: 27px;
  margin: 6px auto 7px;
}
.compare #compare-panel01 td div.rankAward {
  background-image: url("../img/common/most_recommend01.png");
  background-size: contain;
  width: 42px;
  height: 42px;
  margin-left: 1px;
}
.compare #compare-panel01 td div.rankAward span {
  display: none;
}
.compare #compare-panel01 td div.rank1 {
  position: relative !important;
  background-image: url("../../tmp-pc/img/01_top/no1.png");
  background-size: contain;
  width: 34px;
  height: 40px;
  margin: 0 auto;
}
.compare #compare-panel01 td div.rank1 span {
  display: none;
}
.compare #compare-panel01 td div.rank2 {
  background-image: url("../../tmp-pc/img/01_top/no2.png");
  background-size: contain;
  width: 34px;
  height: 40px;
  margin: 0 auto;
}
.compare #compare-panel01 td div.rank2 span {
  display: none;
}
.compare #compare-panel01 td div.rank3 {
  background-image: url("../../tmp-pc/img/01_top/no3.png");
  background-size: contain;
  width: 34px;
  height: 40px;
  margin: 0 auto;
  background-repeat: no-repeat;
}
.compare #compare-panel01 td div.rank3 span {
  display: none;
}
.compare #compare-panel01 th:nth-child(2) {
  background-color: #f5f5f5;
}
.compare #compare-panel01 tr:nth-child(1) td:first-child {
  background-color: #fbffaf !important;
}
.compare #compare-panel01 tr:nth-child(2) td:first-child {
  background-color: #e6e6e6 !important;
}
.compare #compare-panel01 tr:nth-child(3) td:first-child {
  background-color: #ecd48d !important;
}

.point_text_wrapper {
  background-color: #f5f8ff;
  margin: 0px 10px;
  border: 2px solid #3366cc;
  border-radius: 6px;
  padding-bottom: 10px;
}
.point_text_wrapper .point_title {
  color: #fff;
  font-size: 21px;
  font-weight: 600;
  width: 100%;
  margin: 0px auto 17px;
  background-color: #3366cc;
  padding: 6px 0px;
}
.point_text_wrapper .point_title b {
  text-align: center;
  margin: 0 auto;
  width: 220px;
  display: block;
  position: relative;
  padding-left: 40px;
}
.point_text_wrapper .point_title b span {
  position: absolute;
  top: 3px;
  left: -5px;
  padding: 0px 10px;
  color: #3366cc;
  border-radius: 6px;
  background: #fff;
}
.point_text_wrapper p {
  background: none !important;
  padding: 0px 12px 5px 12px;
  margin: 0px;
}
.point_text_wrapper p.point_text_title {
  position: relative;
  padding: 1.5rem 1.5rem calc(1.5rem + 10px);
  border: 2px solid #3366cc;
  color: #3366cc;
  font-size: 15px;
  font-weight: 600;
  margin: 10px 12px 5px 12px;
  padding: 3px 0px 6px 10px;
  border-radius: 4px;
}
.point_text_wrapper p.point_text_title:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  content: "";
  border-top: 2px solid #3366cc;
  background-image: repeating-linear-gradient(-45deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  backface-visibility: hidden;
}

/*********   基礎学習おすすめ案件  *********/
.app_pr_banner {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 20px;
  margin-top: 30px;
  margin-bottom: 20px;
}
.app_pr_banner .app_pr_contents {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  row-gap: 20px;
  padding: 10px;
  background-color: #dbe7ff;
  border-radius: 10px;
}
.app_pr_banner .app_pr_contents .app_pr_title_box {
  background-color: #3366cc;
  border-radius: 6px;
  padding: 10px 20px;
}
.app_pr_banner .app_pr_contents .app_pr_title_box .app_pr_title {
  font-size: 2rem;
  font-weight: bold;
  color: white;
  text-align: center;
  vertical-align: middle;
}
.app_pr_banner .app_pr_contents .app_pr_title_box .app_pr_title::before {
  content: "";
  background-image: url(../img/study/banner/thumbs-up.png);
  background-size: contain;
  width: 31px;
  height: 30px;
  display: inline-block;
}
.app_pr_banner .app_pr_contents .app_pr_title_box .app_pr_title::after {
  content: unset;
}
.app_pr_banner .app_pr_contents .pr_box .pr_title_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: end;
}
.app_pr_banner .app_pr_contents .pr_box .pr_title_box .pr_title_balloon {
  flex: 1;
  background-color: white;
  box-shadow: 0 2px 8px 0 #aac6fd;
  padding: 0 12px;
  border-radius: 40px;
  margin-bottom: 8px;
  height: 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.app_pr_banner .app_pr_contents .pr_box .pr_title_box .pr_title_balloon .pr_title {
  font-size: 13px;
  font-weight: bold;
  color: #3366cc;
  text-align: center;
}
.app_pr_banner .app_pr_contents .pr_box .study_banner_image {
  width: 100px;
}
.app_pr_banner .app_pr_contents .pr_box .pr_contents_box {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 10px;
  padding: 10px 10px 40px;
  background-color: white;
  box-shadow: 0 2px 8px 0 #aac6fd;
  border-radius: 12px;
  overflow: hidden;
}
.app_pr_banner .app_pr_contents .pr_box .pr_contents_box .pr_btn {
  position: absolute;
  right: 0px;
  bottom: 0px;
}
.app_pr_banner .app_pr_contents .pr_box .pr_contents_box .pr_btn .study_banner_detail_image {
  width: 180px;
}

/*********   基礎学習 メニューに戻る & 次へ  *********/
.app_navigation_box {
  display: flex;
  flex-direction: row;
  -moz-column-gap: 10px;
       column-gap: 10px;
  padding: 20px;
}
.app_navigation_box a {
  width: calc(50% - 5px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  font-size: 1.1rem;
  font-weight: bold;
  color: white;
  background-color: #eff4ff;
  padding: 8px;
  font-size: 1.4rem;
}
.app_navigation_box a .index_btn {
  color: #595959;
}
.app_navigation_box a .next_btn {
  display: flex;
  flex-direction: column;
  color: #77787a;
  font-size: 1.2rem;
}
.app_navigation_box span {
  text-align: center;
  align-self: stretch;
  font-size: 1.4rem;
}

.study_banner_auto_image {
  width: 100% !important;
  border-radius: 12px;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
}

.study-wrapper {
  padding-bottom: 16px;
}

.theme_recommend_table {
  background-color: #e3ecff;
}
.theme_recommend_table .theme_recommend_title {
  background-color: #e3ecff;
  margin: -5px 30px -21px 30px;
  position: relative;
}
.theme_recommend_table .theme_recommend_table_wrapper {
  padding: 74px 10px 15px;
  position: relative;
}
.theme_recommend_table .theme_recommend_table_wrapper table {
  box-shadow: 0px 4px 5px 0px #d4e0fa;
  border-radius: 7px;
  border-collapse: separate;
  border: 1px solid #d2ddf3;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr:first-child td:first-child {
  border-top-left-radius: 10px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr:first-child td:last-child {
  border-top-right-radius: 10px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr:last-child td:first-child {
  border-bottom-left-radius: 10px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr:last-child td:last-child {
  border-bottom-right-radius: 10px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr {
  display: flex;
  flex-direction: row;
  width: 100%;
  background-color: unset !important;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr th {
  width: 33.33%;
  font-size: 13px;
  text-align: center;
  background-size: auto auto;
  background-color: rgb(251, 251, 251);
  background-image: repeating-linear-gradient(44deg, transparent, transparent 3px, rgb(244, 244, 244) 3px, rgb(244, 244, 244) 6px);
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td {
  width: 33.33%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 5px 10px;
  background-color: #fff;
  position: relative;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td > span.icon-text {
  font-size: 12px;
  font-weight: bold;
  padding-top: 4px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td .theme_title {
  position: absolute;
  top: -32px;
  left: 50%;
  transform: translate(-50%, -11px);
  width: 91%;
  background-image: url(../img/01_top/theme_title.png);
  background-size: cover;
  aspect-ratio: 182/68;
  align-items: center;
  text-align: center;
  justify-content: center;
  display: flex;
  padding-bottom: 7px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td .theme_title span {
  font-size: 12px;
  color: #fff;
  line-height: 13px;
  font-weight: bold;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td img.circle {
  width: 23px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td span.td_detail {
  height: 36px;
  font-size: 13px;
  border: 1px solid #92c3ff;
  background-color: white;
  color: #4288d9;
  font-weight: 500;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  padding: 0px 10px;
  width: 100%;
  box-shadow: 0px 3px 3px 0px #d3d3d3;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td a.td_official {
  height: 36px;
  font-size: 14px;
  width: 100%;
  background-color: #ff6130;
  color: white;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  padding: 0px 10px;
  box-shadow: 0px 3px 3px 0px #d3d3d3;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td.td_btnbg {
  background-color: #eff5f9;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td.td_campaign {
  display: block;
  line-height: 123%;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  padding: 6px 5px;
}
.theme_recommend_table .theme_recommend_table_wrapper table tr td.td_campaign span {
  font-weight: 600;
  display: inline-block;
}

.ranking-all-title {
  margin: 15px 5px 0px;
}
.ranking-all-title img {
  width: 100%;
}

.ranking-all-wrapper {
  margin: 0px 4px;
  border: 1px solid #b1c4d0;
}
.ranking-all-wrapper .service {
  margin: 10px 4px 5px;
}

.startpoint {
  background-color: #e3ecff;
  padding: 0px 5px 15px;
}
.startpoint-wrapper {
  position: relative;
  padding: 20px 10px 0px;
}
.startpoint-title {
  position: absolute;
  width: 170px;
  top: 7px;
}
.startpoint-title img {
  width: 100%;
}
.startpoint-box {
  background-color: #fff;
  border-radius: 10px;
  display: flex;
  align-items: flex-end;
  padding: 6px 0px 0px 0px;
  overflow: hidden;
}
.startpoint-box-left {
  width: 93px;
  position: relative;
  background-image: url(../img/common/startpoint/bg.png);
  background-size: cover;
  height: 100%;
}
.startpoint-box-left img {
  margin-bottom: -2px;
}
.startpoint-box-right {
  width: calc(100% - 93px);
  margin: 10px 10px 10px 0px;
}

/* CSSアニメーションの設定 */
@keyframes purun {
  0% {
    transform: scale(1, 1) translate(0%, 0%);
  }
  5% {
    transform: scale(0.9, 0.9) translate(0%, 8%);
  }
  10% {
    transform: scale(1.3, 0.8) translate(0%, 9%);
  }
  13% {
    transform: scale(0.8, 1.3) translate(0%, -14%);
  }
  22% {
    transform: scale(1.1, 0.9) translate(0%, 8%);
  }
  30% {
    transform: scale(1, 1) translate(0%, 0%);
  }
  100% {
    transform: scale(1) translate(0%, 0%);
  }
}
@keyframes shiny {
  0% {
    left: -20%;
    opacity: 0.2;
    /* 最初は完全に透明 */
  }
  5% {
    left: -20;
    opacity: 0.2;
    /* 最初の5%は透明 */
  }
  10% {
    left: 0;
    opacity: 0.7;
    /* 最初の5%は透明 */
  }
  20% {
    left: 130%;
    opacity: 1;
    /* 10%で完全に見える */
  }
  90% {
    left: 130%;
    opacity: 0.2;
    /* 90%で完全に見える */
  }
  95% {
    left: 140%;
    opacity: 0.2;
    /* 95%で完全に透明 */
  }
  100% {
    left: 150%;
    /* 最後は右にずれる */
    opacity: 1;
    /* 最後は完全に透明 */
  }
}
.korokoro {
  animation: korokoro 3s linear 0s infinite;
}

.shiny {
  position: relative;
  display: block;
  width: 100%;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
}

.shiny::after {
  content: "";
  position: absolute;
  top: -10%;
  left: -20%;
  width: 40px;
  height: 100%;
  transform: scale(2) rotate(20deg);
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.5) 100%, rgba(255, 255, 255, 0) 0%);
  animation-name: shiny;
  animation-duration: 3s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.purun {
  animation: purun 2s linear 0s infinite;
}

.shake {
  animation: swing 3s infinite;
}

@keyframes swing {
  0%, 100% {
    transform: rotate(0deg);
  }
  4%, 12% {
    transform: rotate(-4deg);
  }
  8%, 16% {
    transform: rotate(4deg);
  }
  20%, 100% {
    transform: rotate(0deg);
  }
}
.column-list-wrapper {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  padding: 60px 10px 30px;
}
.column-list-wrapper .column-list {
  display: flex;
  flex-direction: row;
  -moz-column-gap: 10px;
       column-gap: 10px;
  border-bottom: 1px dashed #d8d8d8;
  padding-bottom: 8px;
  position: relative;
}
.column-list-wrapper .column-list img {
  width: 30.7%;
  /* 120 / 390 */
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 8px;
}
.column-list-wrapper .column-list div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.column-list-wrapper .column-list div p {
  font-size: 14px;
  font-weight: bold;
  color: #222222;
  line-height: normal;
}
.column-list-wrapper .column-list.locked {
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.column-list-wrapper .column-list.locked ::after {
  content: "";
  position: absolute;
  inset: 0 0 8px 0;
  border-radius: 8px;
  background-color: rgba(0, 0, 0, 0.4666666667);
  /* 半透明の黒 */
  z-index: 2;
}
.column-list-wrapper .column-list.locked ::before {
  white-space: pre-wrap;
  position: absolute;
  inset: 0 0 8px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  z-index: 3;
  color: white;
  font-size: 14px;
  background-image: url("../img/lock.svg");
  background-repeat: no-repeat;
  background-size: 32px 32px;
  background-position: center calc(50% - 10px);
  padding-top: 32px;
}
.column-list-wrapper .column-list.locked.review {
  pointer-events: unset;
}
.column-list-wrapper .column-list.locked.review ::before {
  content: "タップしてアプリを評価すると読めるようになります！";
}
.column-list-wrapper .column-list.locked.conversion ::before {
  content: "アプリから口座開設すると読めるようになります！";
}
.column-list-wrapper .column-list:last-of-type {
  border-bottom: 0px;
}

body.page-template-page-column-list {
  overflow-x: hidden;
}

body.page-template-page-column .app_pr {
  display: block;
  background-color: #939393;
  color: white;
  width: 20px;
  height: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 10px;
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 9999;
  border-end-start-radius: 2px;
}

.swiper-slide img {
  border-radius: 8px;
  width: 100%;
}

.swiper-pagination {
  margin: 0;
  font-size: 1rem;
}
.swiper-pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
}
.swiper-pagination .swiper-pagination-bullet-active {
  background-color: #095994;
}

/* アクセスカウンター　*/
.access_count_wrapper {
  position: absolute;
  top: 4px;
}

.access_count {
  border-radius: 40px;
  font-weight: 600;
  display: inline-block;
  padding: 4px 8px;
  line-height: 100%;
  border: 1px solid #14386b;
  color: #14386b;
  background-color: #e3edff;
}
.access_count span {
  color: #f73b62;
}

/*********   診断結果  *********/
.simulation-result {
  text-align: center;
}
.simulation-result-mv {
  position: relative;
}
.simulation-result-mv .access_count {
  text-align: left;
  display: table;
  margin: 0px 0px 0px 10px;
  bottom: 25px;
  position: absolute;
}
.simulation-result .service_title {
  height: auto;
  padding: 7px 0px;
  font-size: 2.7rem;
  line-height: 100%;
  background-size: cover;
  width: calc(100% - 60px);
  text-align: center;
  margin: 0 auto 20px;
  background-color: #eaf9ff;
  border-top: 1px solid #2084ae;
  border-bottom: 1px solid #2084ae;
  position: relative;
}
.simulation-result .service_title:before, .simulation-result .service_title:after {
  content: "";
  background-image: url("../img/simulation/title-ribon.svg");
  background-size: cover;
  width: 42px;
  height: 44px;
  top: 10px;
  position: absolute;
}
.simulation-result .service_title:after {
  right: -23px;
}
.simulation-result .service_title:before {
  left: -23px;
  transform: scaleX(-1);
}
.simulation-result .service_title h4 a {
  color: #2084ae;
}
.simulation-result-service {
  margin-top: -15px;
}
.simulation-result .simulation-table {
  display: flex;
  gap: 10px;
  width: calc(100% - 20px);
  margin: 10px 10px 20px;
  text-align: center;
}
.simulation-result .simulation-table dl {
  display: flex;
  flex-wrap: wrap;
  flex: 1;
}
.simulation-result .simulation-table dl dt {
  width: 100%;
  font-size: 1.3rem;
  font-weight: 500;
  color: #545454;
  align-items: center;
  background-color: #f3f3f3;
  display: flex;
  text-align: center;
  line-height: 130%;
  justify-content: center;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  height: 45px;
}
.simulation-result .simulation-table dl dd {
  width: 100%;
  font-weight: 600;
  font-size: 1.5rem;
  color: #717171;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  background-color: #fcfcfc;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  border: 1px solid #f3f3f3;
}
.simulation-result .point {
  margin: 20px 10px;
}
.simulation-result .point .point-title {
  background-color: #2682b6;
  color: #fff;
  font-size: 1.6rem;
  display: table;
  border-top-left-radius: 10px;
  border-top-right-radius: 20px;
  padding: 5px 10px 5px 37px;
  position: relative;
  font-weight: 600;
}
.simulation-result .point .point-title:before {
  content: "";
  background-image: url("../img/simulation/point.svg");
  background-size: cover;
  width: 25px;
  height: 20px;
  position: absolute;
  left: 8px;
}
.simulation-result .point ul.simulation-point {
  background-color: #eaf9ff;
  padding: 10px;
  border-radius: 10px;
}
.simulation-result .point ul.simulation-point li {
  text-align: left;
  color: #2682b6;
  line-height: 140%;
  margin: 7px 0px;
  padding-left: 20px;
  position: relative;
  border-bottom: 2px dotted #8bc0df;
  padding: 0px 0px 6px 20px;
  font-weight: 600;
}
.simulation-result .point ul.simulation-point li:first-child {
  margin-top: 2px;
}
.simulation-result .point ul.simulation-point li:last-child {
  border: none;
  margin-bottom: 0px;
  padding-bottom: 2px;
}
.simulation-result .point ul.simulation-point li:before {
  content: "";
  background-image: url("../img/simulation/star.svg");
  background-size: cover;
  width: 20px;
  height: 20px;
  position: absolute;
  left: -5px;
}
.simulation-result .simulation-btn {
  margin: 30px 10px 10px;
}
.simulation-result .simulation-btn-cashback {
  color: #ed1f69;
  font-weight: 600;
}
.simulation-result .simulation-btn-cashback span.btn-atention {
  position: relative;
  font-size: 1.5rem;
}
.simulation-result .simulation-btn-cashback span.btn-atention:before, .simulation-result .simulation-btn-cashback span.btn-atention:after {
  content: "";
  background-image: url("../img/simulation/dotline.svg");
  background-size: cover;
  width: 9px;
  top: 3px;
  height: 15px;
  position: absolute;
}
.simulation-result .simulation-btn-cashback span.btn-atention:before {
  left: -13px;
  transform: scaleX(-1);
}
.simulation-result .simulation-btn-cashback span.btn-atention:after {
  right: -13px;
}
.simulation-result .simulation-retry-box {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 0px 20px;
}
.simulation-result .simulation-retry-box .simulation-retry-text {
  font-size: 1.5rem;
  font-weight: bold;
  color: #2682b6;
  opacity: 1;
  text-decoration: underline;
}
.simulation-result .simulation-retry-box .simulation-retry-text:active {
  opacity: 0.6;
}

/*********   multi-table  *********/
.compare#multi-table tbody {
  border-bottom: 1.5px solid rgb(238, 238, 238);
}
.compare#multi-table .h4-box {
  display: block;
  margin: 0 auto;
  text-align: center;
}
.compare#multi-table .sorted-column {
  background-color: rgb(231, 236, 255) !important;
}
.compare#multi-table h4 {
  text-align: center;
  font-size: 26px;
  color: #09639a;
  position: relative;
  display: inline-block;
}
.compare#multi-table h4::before, .compare#multi-table h4::after {
  position: absolute;
  content: "";
  width: 3px;
  height: 27px;
  background-color: #09639a;
}
.compare#multi-table h4::after {
  left: -15px;
  bottom: 2px;
  transform: rotate(-30deg);
}
.compare#multi-table h4::before {
  right: -15px;
  bottom: 2px;
  transform: rotate(30deg);
}
.compare#multi-table .notice {
  margin-left: 0px;
}
.compare#multi-table .compare_change {
  background: none;
  gap: 6px;
}
.compare#multi-table .compare_change_btn {
  border-radius: 0px;
  background-color: #0a639a;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  padding: 7px 0px;
}
.compare#multi-table .compare_change_btn.active {
  color: #0a639a;
  background-color: #f5f5f5;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-top: 1px solid #ddd;
}
.compare#multi-table div.table {
  border: none;
}
.compare#multi-table .compare_show_more_button {
  top: -15px;
  background-color: #0a639a;
}
.compare#multi-table .compare_close_button {
  background-color: #0a639a;
}
.compare#multi-table .panel td a {
  font-size: 1.2rem;
}
.compare#multi-table .panel td:nth-child(1) {
  z-index: 4;
  padding: 0px 2px;
  background-color: #fff;
  width: 50px;
  color: #3f6ec2;
}
.compare#multi-table .panel td:nth-child(1) a span {
  font-size: 1rem;
}
.compare#multi-table .panel td:nth-child(2) {
  background-color: transparent;
}
.compare#multi-table .panel td span.click-move {
  color: #1873c4;
  border-bottom: 1px solid #1873c4;
}
.compare#multi-table .panel td span.click-move:hover {
  color: #e53900;
}
.compare#multi-table .panel td img.circle {
  width: 27px;
  margin: 6px auto 7px;
}
.compare#multi-table .panel td div.rank {
  position: absolute !important;
  left: -1px;
  top: -1px;
  z-index: 3 !important;
  background-color: #0a639a !important;
  color: #fff;
  border-collapse: separate;
  background-image: none;
  width: 34px;
  height: auto;
}
.compare#multi-table .panel td div.rank span {
  display: block;
  color: white;
  font-size: 10px;
}
.compare#multi-table .panel td div.rank1 {
  background-color: #ffd700 !important;
  font-weight: 600;
}
.compare#multi-table .panel td div.rank1 span {
  color: black;
}
.compare#multi-table .panel td div.rank2 {
  background-color: #cbcbcb !important;
  font-weight: 600;
}
.compare#multi-table .panel td div.rank2 span {
  color: black;
}
.compare#multi-table .panel td div.rank3 {
  background-color: #d19d00 !important;
  font-weight: 600;
}
.compare#multi-table .panel td div.rank3 span {
  color: black;
}
.compare#multi-table .panel th.sort-header div {
  padding: 0px !important;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 2px;
       column-gap: 2px;
}
.compare#multi-table .panel th.sort-header div svg {
  fill: #9e9e9e;
  width: 13px;
}
.compare#multi-table .panel tr:nth-child(1) td:first-child {
  background-color: white !important;
}
.compare#multi-table .panel tr:nth-child(2) td:first-child {
  background-color: white !important;
}
.compare#multi-table .panel tr:nth-child(3) td:first-child {
  background-color: white !important;
}
.compare#multi-table .panel tr:nth-child(4) td:first-child {
  background-color: white !important;
}
.compare#multi-table .panel tr.tr_award td {
  background-color: transparent;
}
.compare#multi-table .panel tr.tr_award td:first-child {
  background-color: white;
  padding: 20px 10px 4px !important;
}
.compare#multi-table .panel tr.tr_award td:first-child div.rank {
  width: 70px;
  background-color: unset !important;
}
.compare#multi-table .panel tr.mask {
  position: relative;
}
.compare#multi-table .panel tr.mask td::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  z-index: 3;
  -webkit-mask: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.5) 40%, transparent 90%, transparent 100%);
          mask: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.5) 40%, transparent 90%, transparent 100%);
}
.compare#multi-table #compare-panel01 th:nth-child(1),
.compare#multi-table #compare-panel01 td:nth-child(1) {
  z-index: 4;
  position: sticky;
  left: 0px;
  padding: 16px 10px 4px;
  width: 120px !important;
}
.compare#multi-table #compare-panel01 th:nth-child(2),
.compare#multi-table #compare-panel01 td:nth-child(2) {
  width: 60px;
  padding: unset;
  z-index: 2;
}
.compare#multi-table #compare-panel01 th:nth-child(4),
.compare#multi-table #compare-panel01 td:nth-child(4) {
  width: 80px;
}
.compare#multi-table #compare-panel01 th:nth-child(7),
.compare#multi-table #compare-panel01 td:nth-child(7) {
  width: 75px;
}
.compare#multi-table #compare-panel01 th:nth-child(3), .compare#multi-table #compare-panel01 th:nth-child(5), .compare#multi-table #compare-panel01 th:nth-child(6), .compare#multi-table #compare-panel01 th:nth-child(8),
.compare#multi-table #compare-panel01 td:nth-child(3),
.compare#multi-table #compare-panel01 td:nth-child(5),
.compare#multi-table #compare-panel01 td:nth-child(6),
.compare#multi-table #compare-panel01 td:nth-child(8) {
  width: 70px;
}
.compare#multi-table #compare-panel01 th:nth-child(9),
.compare#multi-table #compare-panel01 td:nth-child(9) {
  width: 260px;
  padding: 5px;
}
.compare#multi-table #compare-panel01 th:nth-child(10),
.compare#multi-table #compare-panel01 td:nth-child(10) {
  width: 52px;
}
.compare#multi-table #compare-panel01 th:nth-child(11),
.compare#multi-table #compare-panel01 td:nth-child(11) {
  width: 100px;
}
.compare#multi-table #compare-panel02 td,
.compare#multi-table #compare-panel03 td {
  font-weight: 600;
  color: #2e2e2e;
  line-height: 103%;
  padding: 4px 2px;
}
.compare#multi-table #compare-panel02 th:nth-child(2), .compare#multi-table #compare-panel02 th:nth-child(3), .compare#multi-table #compare-panel02 th:nth-child(4), .compare#multi-table #compare-panel02 th:nth-child(5), .compare#multi-table #compare-panel02 th:nth-child(6), .compare#multi-table #compare-panel02 th:nth-child(7), .compare#multi-table #compare-panel02 th:nth-child(8), .compare#multi-table #compare-panel02 th:nth-child(9),
.compare#multi-table #compare-panel03 th:nth-child(2),
.compare#multi-table #compare-panel03 th:nth-child(3),
.compare#multi-table #compare-panel03 th:nth-child(4),
.compare#multi-table #compare-panel03 th:nth-child(5),
.compare#multi-table #compare-panel03 th:nth-child(6),
.compare#multi-table #compare-panel03 th:nth-child(7),
.compare#multi-table #compare-panel03 th:nth-child(8),
.compare#multi-table #compare-panel03 th:nth-child(9) {
  font-size: 10px;
}
.compare#multi-table #compare-panel02 th:nth-child(1),
.compare#multi-table #compare-panel02 td:nth-child(1),
.compare#multi-table #compare-panel03 th:nth-child(1),
.compare#multi-table #compare-panel03 td:nth-child(1) {
  z-index: 4;
  position: sticky;
  left: 0px;
  padding: 16px 10px 4px;
  width: 120px !important;
}
.compare#multi-table #compare-panel02 th:nth-child(2), .compare#multi-table #compare-panel02 th:nth-child(3), .compare#multi-table #compare-panel02 th:nth-child(6),
.compare#multi-table #compare-panel02 td:nth-child(2),
.compare#multi-table #compare-panel02 td:nth-child(3),
.compare#multi-table #compare-panel02 td:nth-child(6),
.compare#multi-table #compare-panel03 th:nth-child(2),
.compare#multi-table #compare-panel03 th:nth-child(3),
.compare#multi-table #compare-panel03 th:nth-child(6),
.compare#multi-table #compare-panel03 td:nth-child(2),
.compare#multi-table #compare-panel03 td:nth-child(3),
.compare#multi-table #compare-panel03 td:nth-child(6) {
  width: 65px;
}
.compare#multi-table #compare-panel02 th:nth-child(4),
.compare#multi-table #compare-panel02 td:nth-child(4),
.compare#multi-table #compare-panel03 th:nth-child(4),
.compare#multi-table #compare-panel03 td:nth-child(4) {
  width: 70px;
}
.compare#multi-table #compare-panel02 th:nth-child(7),
.compare#multi-table #compare-panel02 td:nth-child(7),
.compare#multi-table #compare-panel03 th:nth-child(7),
.compare#multi-table #compare-panel03 td:nth-child(7) {
  width: 75px;
}
.compare#multi-table #compare-panel02 th:nth-child(5), .compare#multi-table #compare-panel02 th:nth-child(8), .compare#multi-table #compare-panel02 th:nth-child(9),
.compare#multi-table #compare-panel02 td:nth-child(5),
.compare#multi-table #compare-panel02 td:nth-child(8),
.compare#multi-table #compare-panel02 td:nth-child(9),
.compare#multi-table #compare-panel03 th:nth-child(5),
.compare#multi-table #compare-panel03 th:nth-child(8),
.compare#multi-table #compare-panel03 th:nth-child(9),
.compare#multi-table #compare-panel03 td:nth-child(5),
.compare#multi-table #compare-panel03 td:nth-child(8),
.compare#multi-table #compare-panel03 td:nth-child(9) {
  width: 85px;
}
.compare#multi-table #compare-panel02 th:nth-child(10),
.compare#multi-table #compare-panel02 td:nth-child(10),
.compare#multi-table #compare-panel03 th:nth-child(10),
.compare#multi-table #compare-panel03 td:nth-child(10) {
  width: 52px;
}
.compare#multi-table #compare-panel02 th:nth-child(11),
.compare#multi-table #compare-panel02 td:nth-child(11),
.compare#multi-table #compare-panel03 th:nth-child(11),
.compare#multi-table #compare-panel03 td:nth-child(11) {
  width: 100px;
}
.compare#multi-table th {
  padding: 0px;
}
.compare#multi-table th:nth-child(1) {
  padding: 4px 6px !important;
}

/*********   beginner-guide-v2  *********/
.beginner_guide_v2 {
  background-color: #f4f4f4;
  margin: 0px;
  padding: 3px 10px 20px;
}
.beginner_guide_v2 .beginner_guide_title {
  width: 80%;
  margin: 0 auto;
}
.beginner_guide_v2 .beginner_guide_title img {
  width: 100%;
}
.beginner_guide_v2 .beginner_guide_box {
  background: linear-gradient(to bottom, #1a78ae, #124d75);
  border-radius: 16px;
  padding: 12px;
  margin: 0px;
}
.beginner_guide_v2 .beginner_guide_change {
  background: none;
}
.beginner_guide_v2 .beginner_guide_change_btn {
  border-top: 1px solid #cbeaff;
  background: linear-gradient(to bottom, #124d75, #2290db);
  color: #fff;
  height: 45px;
  border-top: 1px solid #fff;
  border-right: 1px solid #cbeaff;
  border-left: 1px solid #cbeaff;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  font-size: 14px;
}
.beginner_guide_v2 .beginner_guide_change .active {
  color: #09639a;
  border: none;
  background: linear-gradient(to bottom, #d8f0ff, #ffffff);
}
.beginner_guide_v2 .beginner_guide_content_box {
  background-color: #fff;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.beginner_guide_v2 .beginner_guide_panel {
  border: none;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company {
  background-color: #DFF3FF;
  border-radius: 10px;
  padding: 0px 0px 10px 0px;
  margin: 8px auto 0px;
  text-align: center;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company b {
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  display: inline-block;
  text-align: center;
  background-color: #1C79AB;
  width: 100%;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding: 7px 0px;
  line-height: 120%;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app {
  background-color: #dff4ff;
  box-shadow: none;
  padding: 0px;
  margin: 10px 10px 0px 10px;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  background-color: #fff;
  padding: 0px 6px 6px 6px;
  text-align: center;
  border-radius: 6px;
  justify-content: center;
  box-shadow: 0px 4px 5px 0px #d4e0fa;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box .btn_app_logo {
  height: 40px;
  display: flex;
  width: 100%;
  align-items: center;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box .btn_app_logo img {
  max-height: 40px;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box a {
  width: 100%;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box a .seemore {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #fff;
  padding: 5px 0;
  font-weight: 600;
  background-color: #ff6b3e;
  width: 100%;
  margin: 0 auto;
  border-radius: 36px;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box a span {
  width: 20px;
  display: block;
  margin-left: 3px;
}
.beginner_guide_v2 .beginner_guide_panel .beginner_guide_panel_company .btn_app .btn_app_box a span img {
  width: 100%;
}

/********************   LINE誘導ポップアップ　**********************/
.line-back-modal .back-modal-content {
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 2px solid #86edff;
  background-color: #fff;
  border-radius: 20px;
}
.line-back-modal .back-modal-content .back-modal-content-image {
  overflow: hidden;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.line-back-modal .back-modal-content .back-modal-content-action {
  display: flex;
  flex-direction: row;
  justify-content: center;
  -moz-column-gap: 0px;
       column-gap: 0px;
  padding: 0px;
  margin-top: 16px;
  margin-right: 14px;
  align-items: flex-end;
}
.line-back-modal .back-modal-content .back-modal-content-close {
  position: absolute;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  bottom: -50px;
}
.line-back-modal .back-modal-content .no {
  margin-bottom: 20px;
}

.compare.single_table .compare_change {
  flex-direction: column;
  align-items: flex-end;
}
.compare.single_table .compare_change .compare_title {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}
.compare.single_table .compare_change .notice {
  color: white;
  margin-right: 7px;
  margin-bottom: 4px;
}
.compare.single_table .panel .sorted-column {
  background-color: rgb(231, 236, 255) !important;
}
.compare.single_table .panel td a {
  font-size: 1.2rem;
}
.compare.single_table .panel td:nth-child(1) {
  z-index: 4;
  padding: 0px 2px;
  background-color: #fff;
  width: 50px;
  color: #3f6ec2;
}
.compare.single_table .panel td:nth-child(1) a span {
  font-size: 1rem;
}
.compare.single_table .panel td:nth-child(2) {
  background-color: transparent;
}
.compare.single_table .panel td span.click-move {
  color: #1873c4;
  border-bottom: 1px solid #1873c4;
}
.compare.single_table .panel td span.click-move:hover {
  color: #e53900;
}
.compare.single_table .panel td img.circle {
  width: 27px;
  margin: 6px auto 7px;
}
.compare.single_table .panel td div.rank {
  position: absolute !important;
  left: -1px !important;
  top: -1px !important;
  z-index: 3 !important;
  background-color: #0a639a !important;
  color: #fff !important;
  border-collapse: separate;
  background-image: none !important;
  width: 34px !important;
  height: auto !important;
}
.compare.single_table .panel td div.rank span {
  display: block;
  color: white;
  font-size: 10px;
}
.compare.single_table .panel td div.rank1 {
  background-color: #ffd700 !important;
  font-weight: 600;
}
.compare.single_table .panel td div.rank1 span {
  color: black;
}
.compare.single_table .panel td div.rank2 {
  background-color: #cbcbcb !important;
  font-weight: 600;
}
.compare.single_table .panel td div.rank2 span {
  color: black;
}
.compare.single_table .panel td div.rank3 {
  background-color: #d19d00 !important;
  font-weight: 600;
}
.compare.single_table .panel td div.rank3 span {
  color: black;
}
.compare.single_table .panel tr:nth-child(2) td:first-child {
  background-color: white !important;
}
.compare.single_table .panel tr:nth-child(3) td:first-child {
  background-color: white !important;
}
.compare.single_table .panel tr:nth-child(4) td:first-child {
  background-color: white !important;
}
.compare.single_table .panel tr.tr_award td {
  background-color: transparent;
}
.compare.single_table .panel tr.tr_award td:first-child {
  background-color: white;
  padding: 20px 10px 4px !important;
}
.compare.single_table .panel tr.tr_award td:first-child div.rank {
  width: 70px !important;
  background-color: unset !important;
}
.compare.single_table .panel tr.mask {
  position: relative;
}
.compare.single_table .panel tr.mask td::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  z-index: 3;
  -webkit-mask: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.5) 40%, transparent 90%, transparent 100%);
          mask: linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.5) 40%, transparent 90%, transparent 100%);
}
.compare.single_table .panel th.sort-header div {
  padding: 0px !important;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 2px;
       column-gap: 2px;
}
.compare.single_table .panel th.sort-header div svg {
  fill: #9e9e9e;
  width: 13px;
}
.compare.single_table .panel td {
  font-weight: 600;
  color: #2e2e2e;
  line-height: 103%;
}
.compare.single_table .panel th,
.compare.single_table .panel td {
  font-size: 0.8em;
}
.compare.single_table .panel th:nth-child(1),
.compare.single_table .panel td:nth-child(1) {
  z-index: 4;
  position: sticky;
  left: 0px;
  padding: 16px 10px 4px;
  width: 120px !important;
}
.compare.single_table .panel th:nth-child(2),
.compare.single_table .panel td:nth-child(2) {
  width: 60px;
}
.compare.single_table .panel th:nth-child(4),
.compare.single_table .panel td:nth-child(4) {
  width: 80px;
}
.compare.single_table .panel th:nth-child(7),
.compare.single_table .panel td:nth-child(7) {
  width: 75px;
}
.compare.single_table .panel th:nth-child(3), .compare.single_table .panel th:nth-child(5), .compare.single_table .panel th:nth-child(6), .compare.single_table .panel th:nth-child(8),
.compare.single_table .panel td:nth-child(3),
.compare.single_table .panel td:nth-child(5),
.compare.single_table .panel td:nth-child(6),
.compare.single_table .panel td:nth-child(8) {
  width: 70px;
}
.compare.single_table .panel th:nth-child(9),
.compare.single_table .panel td:nth-child(9) {
  width: 260px;
  padding: 5px;
}
.compare.single_table .panel th:nth-child(10),
.compare.single_table .panel td:nth-child(10) {
  width: 52px;
}
.compare.single_table .panel th:nth-child(11),
.compare.single_table .panel td:nth-child(11) {
  width: 100px;
}
.compare.single_table .panel th {
  padding: 0px;
}
.compare.single_table .panel th:nth-child(1) {
  padding: 4px 6px;
}

.service_btn_v2 {
  margin: 10px;
  width: 92%;
  margin: 20px auto 10px;
  position: relative;
  display: block;
  padding: 0px;
  opacity: 1;
}
.service_btn_v2 a {
  text-align: center;
  display: block;
}
.service_btn_v2 .cashback {
  color: #222;
  display: inline-block;
  position: relative;
  font-size: 1.5rem;
  font-weight: 600;
}
.service_btn_v2 .cashback span {
  font-size: 1.5rem;
  color: #ff6c3f;
}
.service_btn_v2 .cashback:before {
  content: "";
  position: absolute;
  left: -11px;
  top: 5px;
  width: 2px;
  height: 1.2em;
  background-color: #222;
  transform: rotate(-25deg);
  transform-origin: left top;
}
.service_btn_v2 .cashback:after {
  content: "";
  position: absolute;
  right: -11px;
  top: 5px;
  width: 2px;
  height: 1.2em;
  background-color: #222;
  transform: rotate(25deg);
  transform-origin: left top;
}
.service_btn_v2 .service_btn_v2_logo {
  width: 80%;
  margin: 0 auto;
  text-align: center;
}
.service_btn_v2 .service_btn_v2_logo img {
  width: auto;
}
.service_btn_v2 .btn-site {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 14px 0px;
  letter-spacing: 0px;
  text-align: center;
  border-radius: 92px;
  border-bottom: 3px solid #9a300f;
  background-color: #ff6b3e;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.service_btn_v2 .btn-site img.arrow {
  width: 30px;
  height: 30px;
  margin-left: 6px;
  top: 0px;
}
.service_btn_v2 .btn-site b {
  font-size: 2.3rem;
  color: #fff;
}

/*********   バナーセクション service  *********/
section.banner_section_service {
  border: 2px dotted #78c0ec;
  margin: 20px 12px;
  border-radius: 10px;
}
section.banner_section_service h4 {
  position: relative;
  border-bottom: 2px dotted #78c0ec;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background-image: repeating-linear-gradient(45deg, #f1fdff, #f1fdff 5px, white 5px, white 10px);
}
section.banner_section_service h4 a span {
  color: #09639a;
}
section.banner_section_service h4::after {
  content: "";
  background-image: url("../img/common/pickup.svg");
  background-size: cover;
  width: 65px;
  height: 65px;
  top: -10px;
  right: 5px;
  position: absolute;
}
section.banner_section_service .banner_section_button {
  display: flex !important;
  margin-top: 10px;
  padding: 4px 0px;
  letter-spacing: 0px;
  text-align: center;
  border-radius: 92px;
  border-bottom: 3px solid #9a300f;
  background-color: #ff6b3e;
  text-align: center;
  justify-content: center;
  align-items: center;
}
section.banner_section_service .banner_section_button b {
  font-size: 11px;
  color: white;
}
section.banner_section_service .banner_section_button img {
  width: 14px;
  margin-left: -2px;
}
section.banner_section_service .ranking_ribon,
section.banner_section_service .point_text_wrapper,
section.banner_section_service .service_btn_v2 {
  display: none;
}

/*********   バナーセクション  *********/
section.banner_section {
  border: 2px dotted #78c0ec;
  padding: 9px 10px 16px 10px;
  margin: 20px 12px;
  display: flex;
  flex-direction: column;
  text-align: center;
  border-radius: 10px;
  background-image: repeating-linear-gradient(45deg, #f1fdff, #f1fdff 5px, transparent 5px, transparent 10px);
}
section.banner_section h4 {
  font-size: 17px;
  margin-bottom: 6px;
  color: #09639a;
  position: relative;
  align-self: center;
  min-width: 250px;
  max-width: 90%;
}
section.banner_section h4:before, section.banner_section h4:after {
  position: absolute;
  content: "";
  width: 2px;
  height: 70%;
  background-color: #09639a;
}
section.banner_section h4:before {
  right: -9px;
  bottom: 2px;
  transform: rotate(30deg);
}
section.banner_section h4:after {
  left: -9px;
  bottom: 2px;
  transform: rotate(-30deg);
}
section.banner_section img {
  max-height: 200px;
  max-width: 100%;
  box-shadow: 0px 4px 5px 0px #d4ddf1;
  border-radius: 10px;
}/*# sourceMappingURL=style.css.map */