@charset "utf-8";
/* CSS Document */

/*----------------------------------------------------------------------------
 ***                                                                Container
----------------------------------------------------------------------------*/
body,h1,h2,h3,h4,h5,h6,td,th,div,p,input,textarea,pre,ul,ol,li,address{
	font-family: "Noto Sans JP", sans-serif;
	font-feature-settings: "palt";
}

body {}

#wrap {}

img{
	/* width: 100%; */
	/* height: auto; */
}

a:hover,
a:link{text-decoration:none;}
div[data-lity]{cursor: pointer;transition:.2s ease-in-out;}
div[data-lity]:hover{opacity:0.8}

section{ margin-bottom:0em;}
.secBox {
    padding: 0rem 0;
}
#mainContents .sectionInner{width: 100%;max-width: 100%;margin: 0 auto;padding: 5rem 0;/* width: 90%; */}

/* tab*/
.tab{}
.tab .tabList{
    margin: 0.5em auto 1.3em;
}
.tab .tabList .tabListItem{
    width: 50%;
    text-align: center;
    color: #88adbc;
    border-bottom: 2px solid #88adbc;
}
.tab .tabList .btnActive{font-weight: bold;color: #ef8346;border-bottom: 4px solid #ef8346;}
.tab .Contents{}

.tab .Contents .tabContents{
    display: none;
}

.tab .Contents .tabContents .contentsList{
    gap: 1em;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}
.tab .Contents .tabContents .contentsList .listItem{
    width: 47%;
    margin: 0 auto;
    padding-bottom: 0.7em;
    border: 1px solid #6a99ab;
    border-radius: 0.5em;
    overflow: hidden;
    }

.tab .Contents .tabContents .contentsList .listItem:last-child{
	margin:0;
}

.tab .Contents .tabContentss .contentsList .listItem:hover{
    border: 1px solid #6a99ab;
}
.tab .Contents .tabContents .contentsList .listItem img{
    /* border-radius: 0.5em 0.5em 0 0; */
    width: 100%;
}
.tab .Contents .tabContents .contentsList .listItem p{
     margin: 0.4em 0;
     font-size: 1.7rem;
     text-align: center;
     color: #2c5c73;
     font-weight: bold;
}
.tab .Contents .tabContents .contentsList .listItem a{
    display: block;
    width: 88%;
    margin: 0 auto;
    padding: 0.2em 0;
    font-size: 1.4rem;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    color: #fff;
    background-color: #ef8346;
    box-shadow: 0 3px #c34a14;
    border-radius: 0.2em;
}

.tab .Contents .contentsActive{display: block;}

/*slider*/
.slickslider .slick-prev,.slicksliderCP .slick-prev{
    top: 105%;
    left: 10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 17px solid #2c5c73;
    border-left: 0;
    z-index: 100;
}

.slickslider .slick-next,.slicksliderCP .slick-next{top: 105%;right: 10px;width: 0%;height: 0;border-style: solid;border-top: 8px solid transparent;border-bottom: 8px solid transparent;border-left: 17px solid #2c5c73;border-right: 0;z-index: 100;}

.slickslider .slick-dots,.slicksliderCP .slick-dots{top: auto;bottom: -30px;margin: 0px 0;padding: 0px 0;}
.slickslider .slick-dots li,.slicksliderCP .slick-dots li{margin:0;}
.slickslider .slick-dots li button:before,.slicksliderCP .slick-dots li button:before{color:#2c5c73;font-size: 8px;}
.slickslider .slick-track,.slicksliderCP .slick-track{display: flex;}


/* .slide:nth-child(n+2) {
    display: none;
} */

/* slick初期化後：すべて表示（slickの制御に任せる） */
.slick-initialized .slider-item {
    display: block;
}


/*----------------------------------------------------------------------------
 ***                                                               共有
----------------------------------------------------------------------------*/
.ShareBtn{
    text-align: center;
}
.ShareBtn a{
    position: relative;
    background: linear-gradient(90deg, #fd6b52 0%, #ed3978 100%);
    border-radius: 50px;
    margin: auto;
    text-decoration: none;
    padding: 1.3rem 4rem;
    display: inline-block;
    color: #fff!important;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1;
    /* width: 100%; */
}
.ShareBtn a::after {
    content: "";
    position: absolute;
    display: block;
    CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;
    width: 0.45em;
    height: 0.45em;
    border-right: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    transform-origin: center;
    opacity: 1;
    transform: rotate(45deg);
    right: 15px;
    top: 16px;
}

.ShareBtn .slide_link{}

.titleBox{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 0 1em 0;
}
.titleBox h2{
    text-align: center;
    display: inline-flex;
    align-items: center;
    gap: 6px;                  /* アイコンとテキストの間隔 */
                 /* テキストの文字色（コーラルオレンジ） */
    font-size: 3rem;            /* テキストの大きさ（お好みで調整） */
    font-weight: bold;
    font-family: sans-serif;
    width: 100%;
    justify-content: center;
    }

.titleBox h2::before {
  content: "";
  display: flex;
  align-items: center;
  justify-content: center;
  /* アイコンの見た目 */
  width: 40px;                /* アイコンの横幅 */
  height: 40px;    
  color: #ffffff;             /* 数字の文字色 */
  font-size: 20px;            /* 数字の大きさ */
  font-weight: bold;
  border-radius: 10px;        /* 角丸の具合 */
}
#trendSec .titleBox h2::before {content: "01";background-color: #ff6f54; }
#purposeSec .titleBox h2::before {content: "02";background-color: #2c5c73; }
#PopularSec .titleBox h2::before {content: "03";background-color: #00a99d; }
#voiceSec .titleBox h2::before {content: "04";background-color: #00a99d; }
#futurefvSec .titleBox h2::before {content: none;}

.titleBox .description{
	text-align: center;
	font-size: 1.6rem;
	margin-top: 0.5em;
	font-weight: 500;
	line-height: 1.3em;
	}
/*----------------------------------------------------------------------------
 ***                                                               checkSec
----------------------------------------------------------------------------*/
#checkSec{}
#checkSec .sectionInner{
    padding: 1em 0em 2.4em 0em;
}
#checkSec .checkSlide{
    /* width: 100%; */
    /* margin: 0 auto; */
    margin-bottom: 6rem;
    }
#checkSec .slide{
    padding: 0 0px;
    box-sizing: border-box;
    margin: 0 3px;
    }
#checkSec .checkSlide .slide_link {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 15px;
    text-decoration: none;
}
#checkSec .slide a{}
#checkSec .slide a picture{
}
#checkSec .slide a picture img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
    }
#checkSec .checkSlide .slide_link::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50%;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.35),
        rgba(0, 0, 0, 0)
    );
    pointer-events: none;
}
#checkSec .slide a .slide_content{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 12px;
    z-index: 2;
    text-align: center;}
#checkSec .slide a .slide_content h3{
    text-align: center;
}
#checkSec .checkSlide .slide_title {
    margin: 0 0 8px;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.2;
    text-shadow:
        2px 2px 3px rgba(0, 0, 0, 0.65),
        -1px -1px 2px rgba(0, 0, 0, 0.35);
}
#checkSec .checkSlide .slide_btn {
    display: inline-block;
    margin: 0;
    padding: 5px 12px;
    background: #fff;
    border-radius: 20px;
    color: #2c5c73;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.2;
    white-space: nowrap;
}

/* Slickの矢印などで幅がおかしくならないように */
#checkSec .checkSlide .slick-list {
    margin: 0px -5px;
}

#checkSec .checkSlide .slick-track {
    display: flex;
}

#checkSec .checkSlide .slick-slide {
    height: auto;
}
#checkSec .slickslider .slick-prev,#checkSec .slicksliderCP .slick-prev,
#checkSec .slickslider .slick-next,#checkSec .slicksliderCP .slick-next {
    top: 114%;
}

#checkSec .checkSlide .slick-dots{
    margin: 0px 0;
    bottom: -40px;
}

/*----------------------------------------------------------------------------
 ***                                                               パンくず
----------------------------------------------------------------------------*/
.breadcrumb {
    position: absolute;
    top: 69px;
    left: 0;
    z-index: 10;
    width: 100%;
    box-sizing: border-box;
    padding: 5px 15px;
    font-size: 12px;
    line-height: 1.5;
    /* background: rgba(255, 255, 255, 0.85); */
    display: flex;
    align-items: baseline;
}

.breadcrumb a {
    color: #333;
    text-decoration: none;
    font-size: 13px;
}

.breadcrumb p {
    color: #333;
    margin-left: 4px;
    font-size: 13px;
}
/*----------------------------------------------------------------------------
 ***                                                               futurefvSec
----------------------------------------------------------------------------*/
#futurefvSec{
    width: 100%;
    /* max-width: 375px; */
    margin: 0 auto;
    background-image: url('../images/img_feature_fv_back.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    padding: 0;
}
#futurefvSec .sectionInner{
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 3em 0 0em 0;
}
#futurefvSec .fv_catch{
    margin: 0px 0 0 35px;
}
#futurefvSec .fvCatch{
    position: absolute;
    top: 35px;
    left: 25px;
    width: 175px;
    height: auto;
    z-index: 2;
}
#futurefvSec .titleBox{
    position: relative;
    z-index: 3;
    /* display: block; */
    width: 100%;
    justify-content: flex-start;
}
#futurefvSec .titleBox .year{
    margin: 120px 0 0 25px;

    font-size: 20px;
    line-height: 1.2;
    font-weight: bold;

    color: #fff;
}
#futurefvSec .titleBox .fvyear{
        margin: 5px 0 0 25px;
        text-shadow: 1px 1px 5px rgb(0 0 0 / 70%);
        color: #fff;
        font-size: 21px;
        font-weight: bold;
        }
#futurefvSec .titleBox h2{
    margin: 0px 0 0 25px;
    text-align: left;
    font-size: 42px;
    line-height: 1.2;
    font-weight: 700;
    color: #245c72;
    text-shadow:
        2px  0   0 #fff,
       -2px  0   0 #fff,
        0    2px 0 #fff,
        0   -2px 0 #fff,
        1px  1px 0 #fff,
       -1px -1px 0 #fff,
        1px -1px 0 #fff,
       -1px  1px 0 #fff;
    display: block;
}
#futurefvSec .titleBox h2 .smal{
    font-size: 80%;
}
#futurefvSec .titleBox h2 .big{
    font-size: 52px;
    color: #f15b4f;
    text-shadow:
        2px  0   0 #fff,
       -2px  0   0 #fff,
        0    2px 0 #fff,
        0   -2px 0 #fff,
        1px  1px 0 #fff,
       -1px -1px 0 #fff,
        1px -1px 0 #fff,
       -1px  1px 0 #fff;
}
/*----------------------------------------------------------------------------
 ***                                                                  説明文
----------------------------------------------------------------------------*/

#futurefvSec .titleBox .description{
    margin: 7px 25px 0;
    font-size: 19px;
    line-height: 1.55;
    font-weight: 600;
    text-align: left;
    color: #086185;
    text-shadow: 2px 2px 2px rgb(255 255 255 / 100%), -1px -1px 2px rgb(255 255 255 / 100%);
}
/*----------------------------------------------------------------------------
 ***                                                               trendSec
----------------------------------------------------------------------------*/
#trendSec{
    background-color: #ffefee;
}
#trendSec .sectionInner{}
#trendSec .titleBox{}
#trendSec .titleBox h2{
   color: #ff6f54;
}
#trendSec .titleBox .heading{}
#trendSec .titleBox p{}
#trendSec .titleBox .description{
    
}
#trendSec .trendSlideBox{
    padding-bottom: 0rem;
}
#trendSec .trendSlideBox .slickslider{}
#trendSec .trendSlideBox .cardItem{
    padding: 0;
    box-sizing: border-box;
    background: #fff;
    border-radius: 17px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
    width: 190px;
    display: flex;}
#trendSec .cardItem a{}
#trendSec .cardItem .trendCard{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 17px;
    text-decoration: none;
}
#trendSec .cardItem picture{}
#trendSec .cardItem img{}
#trendSec .cardItem .card_img{display: block;width: 100%;height: 100%;object-fit: cover;/* overflow: hidden; */}
#trendSec .cardItem span{}

#trendSec .cardItem .card_imgBox{
    position: relative;
    width: 100%;
    height: 150px;
    overflow: hidden;
    flex-shrink: 0;
}
#trendSec .cardItem .card_badge{ 
position: absolute;
left: 10px;
bottom: 9px;
display: inline-block;
padding: 5px 10px;
border-radius: 20px;
color: #fff;
font-size: 12px;
font-weight: bold;
line-height: 1;
white-space: nowrap;
}
#trendSec .cardItem .badge_1{background: #1f2c59;}
#trendSec .cardItem .badge_2{background: #016435;}
#trendSec .cardItem .badge_3{background: #ff8a3d;}
#trendSec .cardItem .badge_4{background: #8050a0;}
#trendSec .cardItem .badge_5{background: #2bad71;}
#trendSec .cardItem .badge_6{background: #169d9a;}


#trendSec .trendSlideBox .slick-track{
    display: flex;
    align-items: stretch;
}

#trendSec .trendSlideBox .slick-slide{
    height: auto !important;
    display: flex;
}

#trendSec .cardItem .card_body{padding: 14px 10px 15px;background: #fff;box-sizing: border-box;flex: 1;display: flex;flex-direction: column;}
#trendSec .cardItem h3{}
#trendSec .cardItem .card_ttl{
margin: 0 0 10px;
color: #ff6757;
font-size: 20px;
font-weight: bold;
line-height: 1.2;
}
#trendSec .cardItem p{}
#trendSec .cardItem .card_txt{margin: 0;color: #333;font-size: 1.5rem;line-height: 1.45;}
#trendSec .cardItem .card_btn{
    margin: auto 0 0;
    padding-top: 2px;
    text-align: center;
    }
#trendSec .cardItem .card_btn a{
    position: relative;
    display: inline-block;
    min-width: 135px;
    padding: 7px 28px 7px 12px;
    box-sizing: border-box;
    border-radius: 20px;
    background: linear-gradient(
        to bottom,
       #6f91bd 0%,
        #244d83 50%,
        #6f91bd 100%
    );
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    line-height: 1.2;
    text-decoration: none;
}
#trendSec .cardItem .card_btn a::after {
    content: "›";
    position: absolute;
    top: 50%;
    right: 9px;
    transform: translateY(-52%);
    font-size: 20px;
    line-height: 1;
}
#trendSec .sectionInner > p{}
#trendSec .sectionInner .ShareBtn{}
#trendSec .sectionInner p a{}
#trendSec .sectionInner p .slide_link{}
#trendSec .slickslider .slick-prev,.slicksliderCP .slick-prev{
    border-right: 17px solid #ff6757;
}
#trendSec .slickslider .slick-next,.slicksliderCP .slick-next{
	border-left: 17px solid #ff6757;}

/*----------------------------------------------------------------------------
 ***                                                               purposeSec
----------------------------------------------------------------------------*/
#purposeSec .sectionInner{}
#purposeSec .titleBox{}
#purposeSec .titleBox h2{
    color: #2c5c73;
}
#purposeSec .titleBox .heading{}
#purposeSec .titleBox p{}
#purposeSec .titleBox .description{}

/* 親要素：2カラム（2列）で並べる設定 */
#purposeSec .purposeBox {
    display: flex;
    flex-wrap: wrap;       /* 横幅が狭くなったら折り返す */
    gap: 20px;             /* ボックス同士の隙間 */
         /* 2枚並ぶように全体の最大幅を広げる */
    margin: 0 auto;
    justify-content: center;
}

/* 各カード：横並びにするために width を指定 */
#purposeSec .purposeBox .subBox {
    display: flex;         /* 画像とテキストを横並びにする */
    width: calc(50% - 4px); /* 2列並び（隙間20px分を引く） */
    min-width: 335px;      /* スマホ等で狭くなったら1列にする */
    border: 2px solid #2c5c73; /* 枠線を追加 */
    border-radius: 12px;   /* 角丸を追加 */
    overflow: hidden;      /* 画像が角丸からはみ出るのを防ぐ */
    background-color: #ffffff;
}

#purposeSec .purposeBox .dispFlex{}

/* ★修正箇所：画像を表示するための設定 */
#purposeSec .purposeBox .subBox .subBox_img {
     width: 80px;
     min-width: 80px;
     background-size: auto 100%;     /* 横は自動(auto)、縦は100%ぴったりに固定 */
     background-position: left center; /* 画像の中心をくり抜く（お好みで left center も可） */
     background-repeat: no-repeat;
}

/* 各背景画像の指定 */
#purposeSec .purposeBox .img_pur1 { background-image: url('../images/img_pur1.jpg'); }
#purposeSec .purposeBox .img_pur2 {background-image: url('../images/img_pur2.jpg');}
#purposeSec .purposeBox .img_pur3 { background-image: url('../images/img_pur3.jpg'); }
#purposeSec .purposeBox .img_pur4 { background-image: url('../images/img_pur4.jpg'); }

/* テキスト・ボタンエリア */
#purposeSec .purposeBox .subBox .subBox_content {
   flex: 1;
   padding: 14px 5px 14px 8px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

#purposeSec .purposeBox .subBox h3{}
#purposeSec .purposeBox .subBox .subHeading {
    font-size: 2rem;
    font-weight: bold;
    color: #ef8346; /* オレンジ色 */
    margin: 0 0 5px 0;
    line-height: 1.4;
}

#purposeSec .purposeBox .subBox p{}
#purposeSec .purposeBox .subBox .subDescription {
    font-size: 1.4rem;
    color: #333333;
    margin: 0 0 5px 0;
    line-height: 1.2em;
    /* height: 3em; */
}

#purposeSec .purposeBox .subBox .linkGroup {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 6px;
}

#purposeSec .purposeBox .subBox .linkGroup a{}
#purposeSec .purposeBox .subBox .linkGroup .linkBtn {
    display: inline-flex;
    align-items: center;
    background-color: #dbe6f5; /* 薄い青色の背景 */
    color: #1a4a75; /* 濃い青色の文字 */
    text-decoration: none;
    font-size: 1.1rem;
    font-weight: bold;
    padding: 1px 13px 1px 4px; /* 右側に矢印が入るスペースを空ける */
    border-radius: 20px; /* カプセル型の角丸 */
    position: relative;
    transition: background-color 0.2s ease;
}

#purposeSec .purposeBox .subBox .linkGroup .linkBtn::after {
    content: '>';
    position: absolute;
    right: 5px;
    font-size: 0.75rem;
    font-weight: bold;
    color: #1a4a75;
}
/*----------------------------------------------------------------------------
 ***                                                               PopularSec
----------------------------------------------------------------------------*/

#PopularSec{
    background: #e6f7f6;
}
#PopularSec .sectionInner{
    width: 100%;
    /* margin: 0 auto; */
    /* padding: 5rem 0; */
}
#PopularSec .titleBox{}
#PopularSec .titleBox h2{
    color: #00a99d;
}
#PopularSec .titleBox .heading{}
#PopularSec .titleBox p{}
#PopularSec .titleBox .description{}
#PopularSec .popularTableBox{
    width: 100%;
}
#PopularSec .tableContainer{
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    border: none;
    border-radius: 0;
    box-sizing: border-box;
    padding-bottom: 8px;
}

#PopularSec .tableContainer table{
	 width: 800px;
    min-width: 800px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    background: #fff;
    border: 2px solid #00a99d;
    border-radius: 12px;
    overflow: hidden;
}
#PopularSec .tableContainer .comparisonTable{
    border-radius: 12px;
    margin-left: 1em;
}
#PopularSec table thead{}
#PopularSec table thead tr{
    background-color: #00a99d;
    /* color: #fff; */
}
#PopularSec table thead th{
     height: 40px;
     padding: 8px 10px;
     box-sizing: border-box;
     color: #fff;
     font-size: 14px;
     font-weight: bold;
     text-align: left;
     white-space: nowrap;
     border: 0px solid #CCC;
}
#PopularSec table thead .col-country{width: 150px;
}
#PopularSec table thead .col-recommend{width: 100px;}
#PopularSec table thead .col-price{width: 125px;}
#PopularSec table thead .col-cost{width: 90px}
#PopularSec table thead .col-features{width: 300px;}
#PopularSec table thead th span{}
#PopularSec table thead th .{}
#PopularSec table tbody{
    padding: 0.5em;
}
#PopularSec table tbody tr{border-bottom: 2px solid #65c9c3;}
#PopularSec table tbody tr:last-child{border-bottom: none;}
#PopularSec table tbody td{padding: 8px 10px;box-sizing: border-box;color: #333;font-size: 13px;font-weight: bold;vertical-align: middle;border: 0px;}
#PopularSec table tbody .td-country{}
#PopularSec table tbody .countryWrap{
	 display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
#PopularSec table tbody .countryWrap img{}
#PopularSec table tbody .countryWrap .flagImg{
    display: block;
	width: 38px;
    height: 25px;
    object-fit: cover;
    flex-shrink: 0;
}
#PopularSec table tbody .countryWrap span{}
#PopularSec table tbody .countryWrap .countryName{white-space: nowrap;font-size: 1.5rem;}
#PopularSec table tbody .cou-recommend{white-space: nowrap;}
#PopularSec table tbody .cou-recommend span{}
#PopularSec table tbody .cou-recommend .stars{
 font-size: 16px;
    letter-spacing: 0;
    color: #ffbd2a;
}
#PopularSec table tbody .cou-price{
    white-space: nowrap;
    font-size: 1.5rem;
}
#PopularSec table tbody .cou-price strong{
    font-size: 15px;
}
#P#PopularSec table tbody .cou-cost{
    white-space: nowrap;
}

#PopularSec table tbody .cou-cost strong{
}
#PopularSec table tbody .cou-cost{
    white-space: nowrap;
    font-size: 1.5rem;
}
#PopularSec table tbody .cou-features{
    color: #00a99d;
    font-weight: bold;
    line-height: 1.4;
    font-size: 1.5rem;
}
#PopularSec .popularTableBox > ul{}
#PopularSec .popularTableBox .tableNotes{margin-top: 1em;}
#PopularSec .popularTableBox .tableNotes li{
    font-size: 14px;
}


/*----------------------------------------------------------------------------
 ***                                                               abroadSec
----------------------------------------------------------------------------*/
#abroadSec .sectionInner{
    padding: 5rem 0 0rem 0;
    width: 90%;
}
#abroadSec .abr-titleBox{margin-bottom: 1em;}
#abroadSec .abr-titleBox h2{margin: 0 0 12px;color: #ff784f;font-size: 28px;font-weight: bold;line-height: 1.15;text-align: center;position: relative;display: inline-block;}
#abroadSec .abr-titleBox h2 span{
    width: 100%;
}
.Slash{
    text-align: center;
}
.Slash h2::before,.Slash h2::after{
 content: "";
    position: absolute;
	top: 50%;
    width: 35px;
    height: 2px;
	background: #ff784f;
}
.Slash h2::before{
    left: -50px;
    transform: rotate(45deg);
}
.Slash h2::after{
    right: -50px;
    transform: rotate(-45deg);
}

#abroadSec .abr-titleBox p{text-align: center;font-weight: 600;}
#abroadSec .titleBox .heading{}
#abroadSec .titleBox h2 span{}
#abroadSec .titleBox p{}
#abroadSec .titleBox .description{
    margin: 0 0 20px;
    color: #333;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.5;
    text-align: center;
    }

#abroadSec .abroadBox{
    flex-wrap: wrap;
    gap: 10px;
    }
#abroadSec .abroadBox .dispFlex{}
#abroadSec .abroadBox .countryCard{
    width: calc(50% - 5px);
    padding: 0;
    box-sizing: border-box;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
    display: flex;
    flex-wrap: wrap;
}
#abroadSec .countryCard .cardHeader{position: relative;
    width: 100%;
    height: 120px;
    box-sizing: border-box;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;}
#abroadSec .countryCard .ab-backimg1{background-image: url("../images/img_back_ab1.jpg");}
#abroadSec .countryCard .ab-backimg2{background-image: url("../images/img_back_ab2.jpg");}
#abroadSec .countryCard .ab-backimg3{background-image: url("../images/img_back_ab3.jpg");}
#abroadSec .countryCard .ab-backimg4{background-image: url("../images/img_back_ab4.jpg");}

#abroadSec .countryCard .countryInfo{
	position: absolute;
    top: 8px;
    left: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    z-index: 2;}
#abroadSec .countryCard .countryInfo .dispFlex{}
#abroadSec .countryCard .countryInfo img{display: block;
    width: 34px;
    height: 23px;}

#abroadSec .countryCard .countryInfo span{}
#abroadSec .countryCard .countryInfo .cou-name{
    color: #fff;

    font-size: 16px;
    font-weight: bold;

    line-height: 1;

    text-shadow:
        1px 1px 2px rgba(0,0,0,0.4);}
#abroadSec .countryCard .cardBody{
	display: flex;
    flex-direction: column;
    flex: 1;
    padding: 9px 8px 10px;
    box-sizing: border-box;
    background: #fff;}

#abroadSec .countryCard .cardBody h3{}
#abroadSec .countryCard .cardBody .cardHeading{
    margin: 0 0 9px;
    color: #173e72;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.3;
}
#abroadSec .countryCard .cardBody ul{
    margin-bottom: 0.5em;
}
#abroadSec .countryCard .cardBody .checkList{}
#abroadSec .countryCard .cardBody li{
    padding-left: 1.5em;
    position: relative;
    font-size: 14px;
}
#abroadSec .countryCard .cardBody li::before{
    content: "";
    position: absolute;
    background-image: url(../images/icon_check.png);
    width: 13px;
    height: 15px;
    left: 0;
    top: 3px;
    }


#abroadSec .countryCard .cardBody a{}
#abroadSec .countryCard .cardBody .detailBtn{
    position: relative;
    display: block;
    width: 125px;
    margin: auto auto 0;
    padding: 6px 20px 6px 10px;
    box-sizing: border-box;
    border-radius: 20px;
    background: linear-gradient(
        to bottom,
        #6f91bd 0%,
        #244d83 50%,
        #6f91bd 100%
    );
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    }

#abroadSec .countryCard .cardBody .detailBtn::after{
    content: "›";
    position: absolute;
    top: 37%;
    right: 8px;
    transform: translateY(-52%);
    font-size: 22px;
    font-weight: normal;
    line-height: 1;
}


/*----------------------------------------------------------------------------
 ***                                                            experienceSec
----------------------------------------------------------------------------*/

#voiceSec{background: #e6f7f6;}
#voiceSec .sectionInner{}
#voiceSec .titleBox{}
#voiceSec .titleBox h2{color: #00a99d;}
#voiceSec .titleBox .description{
    width: 90%;
}

#voiceSec .voiceBox{
    margin-bottom: 70px;
}
#voiceSec .voiceBox .cardItem{
    padding: 9px 11px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 17px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
    width: 250px;
    display: flex;
    border: 2px solid #cccccc;
}
#voiceSec .voiceBox .cardItem .voiceCard{}
#voiceSec .voiceBox .cardItem .voiceCard .vo_topbox{
    margin-bottom: 1em;
}
#voiceSec .voiceBox .cardItem .voiceCard .vo_topbox .vo_ttl{align-items: center;}
#voiceSec .voiceBox .cardItem .voiceCard .vo_topbox .vo_ttl .vo_img{}
#voiceSec .voiceBox .cardItem .voiceCard .vo_topbox .vo_ttl .vo_ttltxt{
    padding-left: 0.5em;
    font-weight: bold;
    font-size: 1.5rem;
}
#voiceSec .voiceBox .cardItem .voiceCard .vo_topbox .vo_subtxt{
    font-weight: 700;
    color: #00a99d;
    font-size: 21px;
    line-height: 1.4em;
}
#voiceSec .voiceBox .cardItem .voiceCard .vo_topbox .vo_contbox{}
#voiceSec .voiceBox .cardItem .voiceCard .vo_contbox .vo_contxt{
    font-size: 15px;
    margin-bottom: 1em;
    line-height: 1.5em;
}
#voiceSec .voiceBox .cardItem .voiceCard .vo_contbox .vo_btn{
    text-align: center;
}
#voiceSec .voiceBox .cardItem .voiceCard .vo_contbox .vo_btn a{
	position: relative;
	display: block;
	width: 125px;
	margin: auto auto 0;
	padding: 3px 6px 3px 6px;
	box-sizing: border-box;
	border-radius: 20px;
	background: #00a99d;
	color: #fff;
	font-size: 15px;
	font-weight: bold;
	}
#checkSec .slickslider .slick-prev,.slicksliderCP .slick-prev,
#voiceSec .slickslider .slick-prev,.slicksliderCP .slick-prev{
    border-right: 17px solid #00a99d;
}
#checkSec .slickslider .slick-next,.slicksliderCP .slick-next,
#voiceSec .slickslider .slick-next,.slicksliderCP .slick-next{
	border-left: 17px solid #00a99d;}
/*----------------------------------------------------------------------------
 ***                                                                  canSec
----------------------------------------------------------------------------*/
#canSec .sectionInner{
    padding: 5rem 0 0rem 0;
    width: 90%;
}
#canSec .can-titleBox{}
#canSec .can-titleBox h2{
    margin: 0 0 12px;
    color: #ff784f;
    font-size: 30px;
    font-weight: bold;
    line-height: 1.15;
    text-align: center;
    position: relative;
    display: inline-block;
}
#canSec .can-titleBox .heading{}
#canSec .can-titleBox h2 span{
    font-size: 70%;
}
#canSec .can-titleBox p{}
#canSec .can-titleBox .description{
    text-align: center;
}
#canSec .canBox{
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 1em;
    gap: -1% 4%;
}
#canSec .canBox .dispFlex{}
#canSec .canBox .can-content{
    flex-wrap: wrap;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
    justify-content: center;
    padding: 2.5rem 1rem 1rem 1rem;
    width: 49%;
    gap: 0;
    margin-bottom: 1rem;
}
#canSec .canBox .can-content .can-ttl{
    flex-wrap: wrap;
    /* gap: 0%; */
}
#canSec .canBox .can-content h3{}
#canSec .canBox .can-content .heading{
    color: #ef8346;
    font-size: 21px;
    width: 100%;
    text-align: center;
    line-height: 1.2em;
}
#canSec .canBox .can-content .order02{
    /* width: 100%; */
}
#canSec .canBox .can-content p{}
#canSec .canBox .can-content .ttlicon{
    /* width: 100%; */
    text-align: center;
    margin: 0 auto;
    height: 40px;
}
#canSec .canBox .can-content .order01{}
#canSec .canBox .can-content .description{
    margin: 6px 0 5px 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5em;
}
#canSec .canBox .can-content .order03{}
#canSec .canBox .can-content p img{}
#canSec .canBox .can-content p .{}


/*----------------------------------------------------------------------------
 ***                                                                FindSec
----------------------------------------------------------------------------*/
#FindSec{
    background: #163c79;
}
#FindSec .sectionInner{/* background: #163c79; */width: 90%;}
#FindSec .titleBox{}
#FindSec .titleBox h2{
    color: #fff;
}
#FindSec .titleBox .heading{
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
    display: block;
    font-size: 25px;
    line-height: 1.5em;
    padding: 15px;
    display: inline-block;
    width: 350px;
}

#FindSec .titleBox h2::before{
    content: none;
}

#FindSec .titleBox p{}
#FindSec .titleBox .description{
    color: #fff;
}

#FindSec .sectionInner > p{}
#FindSec .sectionInner .ShareBtn{}
#FindSec .sectionInner p a{}
#FindSec .sectionInner p .slide_link{}



/*----------------------------------------------------------------------------
 ***                                                               inquirySec
----------------------------------------------------------------------------*/

.inquirySec{
    /* background: #163c79; */
}

.inquirySec .btnBox{margin: 1.3em 0;}
.inquirySec .counseling{
    margin-top: 0;
}
.inquirySec .counseling .text{color:#ef8346;}
.inquirySec .counseling .btn a{background-color:#ef8346;box-shadow: 0 3px #c34a14;}
.inquirySec .line{margin-bottom: 0;}
.inquirySec .line .text{color:#07b53b;}
.inquirySec .line .btn a{background-color:#07b53b;box-shadow: 0 3px #078427;}
.inquirySec .text{font-size: 1.4rem;line-height: 1;text-align:center;}
.inquirySec .text::after,.inquirySec .text::before{
	position: relative;
	display: inline-block;
	content: "";
	width: 1px;
	height: 1em;
	margin: 0 0.5em;
	vertical-align: middle;
}
.inquirySec .counseling .text::before,
.inquirySec .counseling .text::after{background-color:#ef8346;}
.inquirySec .line .text::before,
.inquirySec .line .text::after{background-color:#07b53b;}
.inquirySec .text::before{transform: rotate(-35deg);}
.inquirySec .text::after{transform: rotate(35deg);}
.inquirySec .btn{position:relative;font-size: clamp(1.4rem,4.8vw,1.92rem);margin: 0 auto;/* padding: 0.5em 0; */border-radius: 0.3em;font-weight:bold;color:#fff;width: 80%;text-align: center;line-height: 1;}
.inquirySec .btn::before,.inquirySec .btn::after{
	 content: "";
	 position: absolute;
	 top:50%;
	 right: 10px;
	 width: 15px;
	 height: 4px;
	 border-radius: 9999px;
	 background-color: rgb(255,255,255,1);
	 transform-origin: 92%;
	 z-index: 999;
}
.inquirySec .btn::before{transform: rotate(45deg);}
.inquirySec .btn::after{transform: rotate(-45deg);}
.inquirySec .btn a{color:#fff;text-decoration: none;width: 100%;padding: 0.5em 15px;display: inline-block;*/border-radius: 0.3em;*/border-radius: 0.3em;*/border-radius: 0.3em;border-radius: 0.3em;}

.inquirySec .titleBox{
	width: 100%;
	margin: 0 auto 2rem;
	display: flex;
	flex-direction: column;
	/* margin-bottom: 0.1em; */
}
.inquirySec .titleBox .title{
	font-size: 2.5rem;
	line-height: 1.1;
	text-align: center;
	order: 2;
	text-align: center;
	display: block;
	width: 100%;
	color: #2c5c73;
}

.inquirySec .titleBox .title::before {
  content: none;
}
.inquirySec .titleBox .subTitle{
	color: #ef8346;
	/* font-size: 125%; */
	font-size: 1.9rem;
	font-weight: bold;
	text-align: center;
	line-height: 1;
	order: 1;
}
.inquirySec .titleBox .text{
	margin-top: 0.7em;
	font-size: 1.5rem;
	text-align: center;
	order: 3;
	line-height:1.4;
}
.inquirySec .titleBox .text:before,
.inquirySec .titleBox .text:after{content:none;}





/*----------------------------------------------------------------------------
 ***                                                            counselingSec
----------------------------------------------------------------------------*/

#counselingSec{
    margin-bottom: 0;
}
#counselingSec .btn{
    /* display: block; */
    /* width: 90%; */
    /* font-size: 120%; */
    margin-top: 1.5em;
}

/*----------------------------------------------------------------------------
 ***                                                                  formSec
----------------------------------------------------------------------------*/
::placeholder{ color:#999; font-size:87.5%; font-weight:normal;}
#formSec{
    background: #eeeeee;
}
#formSec h3 span{ display:block; color:#E63582; font-size:60%;}
#formSec h3{
    text-align: center;
}
::placeholder{ color:#999; font-size:87.5%; font-weight:normal;}
#formSec{}
#formSec .sectionInner{
    width: 90%;
}
#formSec h4{ max-width:900px; margin:1em auto; background-color:#3D4393; color:#fff; font-size:137.5%; font-weight:normal; padding:0.5em; line-height:1em;}
#formSec h4 .textNotes{ display:inline-block; margin:0 1em; font-size:75%;}

#formSec .inputList{ max-width:900px; width:100%; margin:1em auto;}
#formSec .inputList > li:not(:last-child){ border-bottom:1px dashed #ccc;}
#formSec .inputList > li{ padding:0.5em; font-size:112.5%; line-height:1.8em;}
#formSec .inputList li .textNotes{ color:#999; font-size:75%; margin:0;}
#formSec .inputList li span{ display:inline-block; max-width:200px; width:100%; position:relative; margin:0.5em 1em 0.5em 0; color:#000;}
#formSec .inputList li span.requiredItem:after{content:"必須";color:#E63582;/* position:absolute; *//* right: 0px; */margin-left: 13px;}
#formSec .inputList li .addInput input[type=button]{ font-size:87.5%; cursor:pointer;}
#formSec .inputList li ul li{line-height:2em;margin: 0 1em 0 0;}

/*----------------------------------------------------------------------------*/
#formSec .inputList > li > input,
#formSec .inputList > li > select{ max-width:300px; width:100%;}
/*----------------------------------------------------------------------------*/
#formSec .inputList li input,
#formSec .inputList li select,
#formSec .inputList li textarea{border:1px solid #999;border-radius:5px;padding:0.3em 0.6em;margin:0.5em;color:#000;font-size: 100%;font-size: 14px;}
/*----------------------------------------------------------------------------*/
#formSec .inputList li .addInput,
#formSec .inputList li .checkBoxInput,
#formSec .inputList li textarea{ max-width:640px; width:100%;}


/*----------------------------------------------------------------------------*/

#formSec p.tac{ margin:1em auto;}
#formSec p.tac a{ display:inline-block; color:#16B2BE; font-weight:bold;}

#formSec div.tac{ margin:2em auto;}
#formSec .commonBtn{
	max-width:300px;
	width:70%;
	font-size: 120%;
	display: inline-block;
	padding:0.5em 0.5em 0.8em;
	background:#16B2BE;
	color:#FFF;
	border:none;
	border-bottom:solid 5px #0087A2;
	border-radius:0;
	transition:margin-top 0s;
	cursor:pointer;
	position:relative;
}
#formSec .commonBtn:after{
	content:"";
	width:10px;
	height:10px;
	border-style:solid;
	border-width:2px;
	border-color:transparent transparent #fff #fff;
	transform:rotate(-45deg);
	position:absolute;
	left:0;
	right:0;
	bottom:0.6em;
	margin:auto;
	opacity:0.6;
}
#formSec .commonBtn:hover{ margin-top:5px; border:none; opacity:0.6;}

#formComment{
    text-align: center;
}
#formSec .submitBox{}
#formSec .submitBox input{
    text-align: center;
    font-size: 20px;
    font-weight: 500;
}
#formSec .agreeLabel{
    display: flex;
    justify-content: center;
}

/*----------------------------------------------------------------------------
 ***                                                             送信完了画面
----------------------------------------------------------------------------*/
#thanksSec{}
#thanksSec h2{ font-size:250%; margin:1em auto; color:#E63582;}
#thanksSec p{ text-align:center;}
#thanksSec .infoBox{ max-width:320px; width:90%; margin:1em auto;}
#thanksSec .infoBox p{ margin:2em 1em;}
#thanksSec .infoBox .backBtn{ color:#fff; font-size:125%;}
#thanksSec .infoBox .backBtn:hover{ opacity:0.6;}
#thanksSec .infoBox #imaikeruBtn a{background-color:#fff;border:1px solid #E63582;color:#E63582;padding: 0.5em 3em;border-radius: 2em;font-family: 'Noto Sans JP', sans-serif;}
#thanksSec .infoBox #homeBtn a{background-color:#f40026;border-radius: 2em;padding: 0.5em 1em;display: inline-block;}