﻿
  .main-area {
    font-family: "fot-tsukuardgothic-std", sans-serif;
    font-weight: 400;
    font-style: normal;
    box-sizing: border-box;
    overflow: hidden;
  }

  .main-area img {
    width: 100%;
    height: auto;
  }

  .main-area .sp_only {
    display: block;
  }

  .main-area .pc_only {
    display: none;
  }

  .main-area .sec {
    width: 100%;
    position: relative;
  }

/************** js **************/
  .main-area .js_imgFadeIn {
    opacity: 0;
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
    transform: translateY(50px);
  }

  .main-area .imgAnimated{
    opacity: 1;
    transform: translateY(0);
  }

/************** item_img_bg **************/
  .item_img01 {
    background: url(../img/bg/item01_bg.png) no-repeat center / 100%;
  }

  .item_img02 {
    background: url(../img/bg/item02_bg.png) no-repeat center / 100%;
  }

  .item_img03 {
    background: url(../img/bg/item03_bg.png) no-repeat center / 100%;
  }

  .item_img04 {
    background: url(../img/bg/item04_bg.png) no-repeat center / 100%;
  }

  .item_img05 {
    background: url(../img/bg/item05_bg.png) no-repeat center / 100%;
  }

  .item_img06 {
    background: url(../img/bg/item06_bg.png) no-repeat center / 100%;
  }

  .item_img07 {
    background: url(../img/bg/item07_bg.png) no-repeat center / 100%;
  }

  .item_img08 {
    background: url(../img/bg/item08_bg.png) no-repeat center / 100%;
  }

  .item_img09 {
    background: url(../img/bg/item09_bg.png) no-repeat center / 100%;
  }

  .item_img10 {
    background: url(../img/bg/item10_bg.png) no-repeat center / 100%;
  }


/************** common **************/
  .main-area .item_box {
    width: calc(375* (100vw /375));
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 15;
  }

  .main-area .item_img {
    margin-bottom: calc(20* (100vw /375));
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .main-area .item_img li {
    width: calc(125* (100vw /375));
  }

  .main-area .item_text {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
  }

  .main-area .item_btn_box {
    width: 100%;
  }

  .main-area .item_name {
    margin-bottom: calc(6* (100vw /375));
    font-family: var(--noto-sans);
    font-weight: 400;
    letter-spacing: 0.05em;
    font-size: calc(14* (100vw /375));
    line-height: 1.71;
  }

  .main-area .item_tax {
    margin-bottom: calc(11* (100vw /375));
    font-family: var(--noto-sans);
    font-weight: 400;
    letter-spacing: 0.05em;
    font-size: calc(13* (100vw /375));
  }

  .main-area .item_btn {
    width: calc(160* (100vw /375));
    height: calc(40* (100vw /375));
    font-size: calc(16* (100vw /375));
    letter-spacing: 0.1em;
    max-width: 100%;
    max-height: 100%;
    border: none;
    background-color: #55A2D3;
    color: #FFFFFF;
    font-family: "poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
    position: absolute;
    position: relative;
  }

  /* まる */
  .main-area .sec .run{
    animation: rotate-anime 17s  linear infinite;
  }

  .main-area .sec02 .ttl02 {
    width: calc(180* (100vw /375));
    position: absolute;
    top: calc(520* (100vw /375));
    left: auto;
    right: calc(-18* (100vw /375));
    z-index: 15;
  }

  .main-area .sec03 .ttl02 {
    width: calc(160* (100vw /375));
    position: absolute;
    top: calc(420* (100vw /375));
    left: auto;
    right: calc(-38* (100vw /375));
  }

  .main-area .secHome_about-ticker {
    left: 0;
  }

  .main-area .secHome_about-ticker-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .main-area .secHome_about-ticker-row.__btm {
    margin-top: 2.4rem;
  }

  /* 回転テキスト */
  .main-area .news_ticker2 {
    width:100%;
    overflow:hidden;
    white-space:nowrap;
    height: calc(56* (100vw /375));
    position: absolute;
    top: auto;
    bottom: calc(257* (100vw /375));
    z-index: 15;
  }

  .main-area .slick-initialized .slick-slide {
    margin-left: calc(15* (100vw /375));
  }

  .main-area .news_ticker2 .img {
    width: calc(685* (100vw /375));
  }

/************** mv **************/
  .main-area .mv {
    width: 100%;
    margin-bottom: calc(57* (100vw /375));
  }

  .main-area .mv_img {
    margin-bottom: calc(35* (100vw /375));
  }

  .main-area .mv_text {
    margin-bottom: calc(24* (100vw /375));
    font-size: calc(14* (100vw /375));
    line-height: 1.75;
    text-align: center;
    color: #363636;
    letter-spacing: 0.05em;
  }

  .main-area .mv_sub_img {
    margin: 0 auto;
    width: calc(326* (100vw /375));
  }

/************** sec_point **************/
  .main-area .sec_point_bg {
    position: relative;
  }

  .main-area .sec_point_bg::before {
    height: calc(956* (100vw /375));
    top: calc(104* (100vw /375));
    width: 100%;
    z-index: -1;
    content: '';
    display: block;
    position: absolute;
    background-size: contain;
    background-color: #CEE3F1;
  }

  .main-area .sec_point {
    margin-bottom: calc(60* (100vw /375));
  }

  .main-area .model_img01 {
    margin: 0 auto calc(115* (100vw /375));
    width: calc(357* (100vw /375));
  }

  .main-area .point_ttl {
    font-size: calc(18* (100vw /375));
    letter-spacing: 0.05em;
    width: max-content;
    font-family: "poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
    position: absolute;
    color: #55A2D3;
  }

  .main-area .point_img {
    width: calc(280* (100vw /375));
  }

  .main-area .point_text {
    font-size: calc(14* (100vw /375));
    letter-spacing: 0.05em;
    line-height: 1.42;
  }

  /*** point01 ***/
  .main-area .point01 {
    margin: 0 0 calc(113* (100vw /375)) calc(12* (100vw /375));
    position: relative;
  }

  .main-area .point01::before {
    width: calc(110* (100vw /375));
    height: calc(105* (100vw /375));
    top: calc(-167* (100vw /750));
    right: calc(16* (100vw /375));
    left: auto;
    content: '';
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../img/svg/point_img01.svg);
    z-index: 5;
  }

  .main-area .point01 .point_ttl {
    top: calc(60* (100vw /375));
    left: calc(-34* (100vw /375));
    transform: rotateZ( 90deg );
  }

  .main-area .point01 .point_text {
    margin: calc(-2* (100vw /375)) 0 0 calc(10* (100vw /375));
  }

  /*** point02 ***/
  .main-area .point02 {
    margin: 0 calc(13* (100vw /375)) 0 auto;
    width: calc(295* (100vw /375));
    position: relative;
  }

  .main-area .point02::before {
    width: calc(110* (100vw /375));
    height: calc(105* (100vw /375));
    top: calc(-172* (100vw /750));
    left: calc(-52* (100vw /375));
    content: '';
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../img/svg/point_img02.svg);
    z-index: 5;
  }

  .main-area .point02 .point_img {
    margin: 0 0 0 auto;
  }

  .main-area .point02 .point_ttl {
    top: calc(60* (100vw /375));
    right: calc(-30* (100vw /375));
    left: auto;
    transform: rotateZ( 90deg );
  }

  .main-area .point02 .point_text {
    margin: calc(-4* (100vw /375)) 0 0 calc(26* (100vw /375));
  }

/************** sec01 **************/
  .main-area .sec01_bg {
    position: relative;
  }

  .main-area .sec01_bg::before {
    height: calc(292* (100vw /375));
    top: calc(726* (100vw /750));
    width: 100%;
    z-index: -1;
    content: '';
    display: block;
    position: absolute;
    background-size: contain;
    background-color: #EBF6FD;
  }

  .main-area .sec01 {
    margin-bottom: calc(62* (100vw /375));
  }

  .main-area .sec01 .sec_ttl {
    margin: 0 auto calc(28* (100vw /375));
    width: calc(278* (100vw /375));
  }

  .main-area .sec01 .model_img {
    margin: 0 auto calc(32* (100vw /375));
    width: calc(317* (100vw /375));
  }

  .main-area .sec01::before {
    width: calc(70* (100vw /375));
    height: calc(76* (100vw /375));
    top: auto;
    bottom: calc(530* (100vw /750));
    right: calc(16* (100vw /375));
    left: auto;
    content: '';
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../img/svg/sp_item_text01.svg);
    z-index: 5;
  }

/************** sec02 **************/
  .main-area .sec02_bg {
    position: relative;
  }

  .main-area .sec02_bg::before {
    height: calc(930* (100vw /375));
    top: calc(390* (100vw /750));
    width: 100%;
    z-index: -1;
    content: '';
    display: block;
    position: absolute;
    background-size: contain;
    background-color: #FDF2F2;
  }

  .main-area .sec02 {
    margin-bottom: calc(62* (100vw /375));
  }

  .main-area .sec02 .sec_ttl {
    margin: 0 auto calc(28* (100vw /375));
    width: calc(223* (100vw /375));
  }

  .main-area .sec02 .model_img {
    margin: 0 auto calc(32* (100vw /375));
    width: calc(358* (100vw /375));
    position: relative;
    z-index: 10;
  }

  .main-area .model_img03 {
    margin: 0 0 calc(38* (100vw /375)) calc(66* (100vw /375));
    width: calc(114* (100vw /375));
    position: relative;
    z-index: 10;
  }

  .main-area .sec02::before {
    width: calc(238* (100vw /375));
    height: calc(249* (100vw /375));
    top: auto;
    bottom: calc(682* (100vw /750));
    left: calc(16* (100vw /375));
    content: '';
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../img/svg/sp_item_circle_text01.svg);
    z-index: 5;
  }

/************** sec03 **************/
  .main-area .sec03_bg {
    position: relative;
  }

  .main-area .sec03_bg::before {
    height: calc(358* (100vw /375));
    top: calc(1021* (100vw /750));
    width: 100%;
    z-index: -1;
    content: '';
    display: block;
    position: absolute;
    background-size: contain;
    background-color: #EBF6FD;
  }

  .main-area .sec03 {
    margin-bottom: calc(161* (100vw /375));
  }

  .main-area .sec03 .sec_ttl {
    margin: 0 auto calc(-6* (100vw /375));
    width: calc(244* (100vw /375));
    position: relative;
    z-index: 10;
  }

  .main-area .sec03 .model_img {
    margin: 0 auto calc(39* (100vw /375));
    width: 100%;
  }

  .main-area .sec03 .model_img06 {
    width: calc(112* (100vw /375));
    height: calc(362* (100vw /375));
    top: auto;
    bottom: calc(-663* (100vw /750));
    left: calc(5* (100vw /375));
    z-index: 15;
    position: absolute;
  }

  .main-area .sec03::after {
    width: calc(154* (100vw /375));
    height: calc(262* (100vw /375));
    top: auto;
    bottom: calc(-540* (100vw /750));
    left: calc(6* (100vw /375));
    content: '';
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../img/svg/sp_item_text02.svg);
    z-index: 15;
  }

/************** sec04 **************/
  .main-area .sec04_bg {
    position: relative;
  }

  .main-area .sec04_bg::before{
    height: calc(866* (100vw /375));
    top: calc(300* (100vw /750));
    width: 100%;
    z-index: -1;
    content: '';
    display: block;
    position: absolute;
    background-size: contain;
    background-color: #FDF2F2;
  }

  .main-area .sec04 {
    margin: 0 0 0;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
  }

  .main-area .sec04 .sec_ttl {
    margin: 0 auto calc(29* (100vw /375));
    width: calc(130* (100vw /375));
    position: relative;
    z-index: 10;
  }

  .main-area .sec04 .point_img04 {
    margin: calc(-4* (100vw /750)) 0 calc(2* (100vw /375)) calc(26* (100vw /375));
    width: calc(298* (100vw /375));
  }

  .main-area .point_img05 {
    margin: 0 calc(6* (100vw /375)) calc(33* (100vw /375)) auto;
    width: calc(322* (100vw /375));
  }
  
/************** btn **************/
  .main-area .sec_btn {
    margin: 0 auto;
    padding: calc(60* (100vw /375)) 0 calc(50* (100vw /375));
  }

  .main-area .sec_btn a {
    margin: 0 auto;
    font-size: calc(13* (100vw /375));
    letter-spacing: 0.05em;
    font-weight: 600;
    width: calc(300* (100vw /375));
    max-width: calc(300* (100vw /375));
    height: calc(50* (100vw /375));
    max-height: calc(50* (100vw /375));
    background-color: transparent;
    font-family:var(--noto-sans);
  }

  .main-area .sec_btn a:last-child {
    margin-top: calc(16* (100vw /375));
    background-color: #000;
    color: #fff;
  }


/* ===============================================
### PC用デザイン###
=============================================== */
@media screen and (min-width:768px) {

  .main-area .sp_only {
    display: none;
  }

  .main-area .pc_only {
    display: block;
  }

  .main-area .sec {
    max-width: 140rem;
  }

/************** common **************/
  .main-area .item_box {
    margin: 0 auto;
    width: 72rem;
    justify-content: space-between;
  }

  .main-area .item_img {
    margin-bottom: 2.0rem;
    width: 72rem;
  }

  .main-area .item_img li {
    width: 22rem;
  }

  .main-area .item_btn_box {
    width: 100%;
  }

  .main-area .item_btn:hover {
    background-color: #ED9393;
  }

  .main-area .item_name {
    margin-bottom: .2rem;
    letter-spacing: 0.05em;
    font-size: 1.2rem;
    line-height: 1.66;
  }

  .main-area .item_tax {
    margin-bottom: 1.1rem;
    font-family: var(--noto-sans);
    letter-spacing: 0.05em;
    font-size: 1.1rem;
  }

  .main-area .item_btn {
    width: 16.0rem;
    height: 3.0rem;
    font-size: 1.4rem;
    letter-spacing: 0.1em;
  }

  /* まる */
  .main-area .sec02 .ttl02 {
    width: 18rem;
    position: absolute;
    top: 94%;
    left: auto;
    right: 56%;
  }

  .main-area .sec03 .ttl02 {
    width: 20rem;
    position: absolute;
    top: -24.3%;
    left: auto;
    right: -13%;
  }

  .main-area .secHome_about-ticker-row.__btm {
    margin-top: 2.4rem;
  }

  /* 回転テキスト */
  .main-area .news_ticker2 {
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    height: 6.7rem;
    bottom: 33.8rem;
    z-index: 15;
  }

  .main-area .slick-initialized .slick-slide {
    margin-left: 2rem;
  }

  .main-area .news_ticker2 .img {
    width: 82.2rem;
  }

/************** mv **************/
  .main-area .mv {
    margin: 0 auto 5.5rem;
    width: 100%;
    max-width: 140rem;
  }

  .main-area .mv_img {
    margin-bottom: 1.8rem;
  }

  .main-area .mv_text {
    margin-bottom: 3.7rem;
    font-size: 1.4rem;
    line-height: 1.75;
    letter-spacing: 0.05em;
  }

  .main-area .mv_sub_img {
    margin: 0 auto;
    width: 32.6rem;
  }

/************** sec_point **************/
  .main-area .sec_point_bg {
    position: relative;
  }

  .main-area .sec_point_bg::before {
    height: 69.8rem;
    top: 10.6rem;
    width: 100%;
  }

  .main-area .sec_point {
    margin: 0 auto 17.2rem;
    width: 102rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .main-area .point_box {
    margin: 15rem 7rem 0 auto;
    width: 34rem;
  }

  .main-area .model_img01 {
    margin: 0;
    width: 51.8rem;
  }

  .main-area .point_ttl {
    font-size: 1.8rem;
  }

  .main-area .point_img {
    width: 28.0rem;
  }

  .main-area .point_text {
    font-size: 1.2rem;
    line-height: 1.66;
  }

  /*** point01 ***/
  .main-area .point01 {
    margin: 0 3rem 0 auto;
    position: relative;
    width: 27.2rem;
  }

  .main-area .point01::before {
    width: 11.0rem;
    height: 10.5rem;
    top: -8.5rem;
    right: -9rem;
    left: auto;
  }

  .main-area .point01 .point_img {
    margin: 0 0 0 auto;
  }

  .main-area .point01 .point_ttl {
    top: 5.8rem;
    left: -3.2rem;
    transform: rotateZ( 90deg );
  }

  .main-area .point01 .point_text {
    margin: -.2rem 0 0 1.0rem;
  }

  /*** point02 ***/
  .main-area .point02 {
    margin: 8.2rem 0 0 0;
    width: 27.2rem;
    position: relative;
  }

  .main-area .point02::before {
    width: 11.0rem;
    height: 10.5rem;
    top: -8.5rem;
    left: -8rem;
  }

  .main-area .point02 .point_img {
    margin: 0 0 0 auto;
  }

  .main-area .point02 .point_ttl {
    top: 6.0rem;
    right: -3.8rem;
    left: auto;
    transform: rotateZ( 90deg );
  }

  .main-area .point02 .point_text {
    margin: -.2rem 0 0 1rem;
  }

/************** sec01 **************/
  .main-area .sec01_bg {
    position: relative;
  }

  .main-area .sec01_bg::before {
    height: 66rem;
    top: 23.2rem;
  }

  .main-area .sec01 {
    margin: 0 auto 9.5rem;
    width: 90rem;
  }

  .main-area .sec01 .sec_ttl {
    margin: 0 auto 2.9rem;
    width: 39.6rem;
  }

  .main-area .sec01 .model_img {
    margin: 0 auto 3rem;
    width: 49.8rem;
  }

  .main-area .sec01::before {
    width: 8.2rem;
    height: 9rem;
    top: auto;
    bottom: 28.1rem;
    right: 7.9rem;
    left: auto;
    background-image: url(../img/svg/pc_item_text01.svg);
  }

/************** sec02 **************/
  .main-area .sec02_bg {
    position: relative;
  }

  .main-area .sec02_bg::before {
    height: 60rem;
    top: 23.4rem;
  }

  .main-area .sec02 {
    margin: 0 auto 11.1rem;
    width: 102rem;
  }

  .main-area .sec02 .sec_ttl {
    margin: 0 auto 3.2rem;
    width: 34.8rem;
  }

  .main-area .sec02_model_box {
    margin-bottom: 1.6rem;
    width: 86rem;
    display: flex;
    justify-content: space-between;
    position: relative;
  }

  .main-area .sec02 .model_img {
    margin: 0;
    width: 49.8rem;
    position: relative;
    z-index: 10;
  }

  .main-area .model_img03 {
    margin: 9.9rem 0 0 0;
    width: 15.5rem;
  }

  .main-area .sec02::before {
    width: 32.5rem;
    height: 32.5rem;
    top: auto;
    bottom: 43.3rem;
    left: 63.5rem;
    background-image: url(../img/svg/pc_item_circle_text01.svg);
  }

  .main-area .sec02 .item_box {
    width: 47rem;
  }

  .main-area .sec02 .item_img {
    margin-bottom: 2.0rem;
    width: 47rem;
  }

/************** sec03 **************/
  .main-area .sec03_bg {
    position: relative;
  }

  .main-area .sec03_bg::before {
    height: 72.7rem;
    top: auto;
    bottom: -8rem;
  }

  .main-area .sec03_box {
    margin: 0 auto;
    width: 72rem;
    position: relative;
  }

  .main-area .sec03 {
    margin: 0 auto 17.7rem;
    max-width: 140rem;
    width: 100%;
  }

  .main-area .sec03 .sec_ttl {
    margin: 0;
    width: 37rem;
    position: absolute;
    top: -1.2%;
    right: 14.5%;
    z-index: 10;
  }

  .main-area .sec03 .model_img {
    margin: 0 auto 4rem;
    width: 100%;
  }

  .main-area .sec03 .model_img06 {
    width: 15rem;
    height: 48.3rem;
    top: auto;
    bottom: -22.7%;
    left: 7.6%;
  }

  .main-area .sec03::after {
    width: 20.6rem;
    height: 35rem;
    top: auto;
    bottom: -16.9rem;
    left: 10.9rem;
    background-image: url(../img/svg/pc_item_text02.svg);
  }

/************** sec04 **************/
  .main-area .sec04_bg {
    position: relative;
  }

  .main-area .sec04_bg::before  {
    height: 52rem;
    top: 37.3rem;
  }

  .main-area .sec04 {
    margin: 0 auto ;
  }

  .main-area .sec04 .sec_ttl {
    margin: 0 auto 2.9rem;
    width: 24.4rem;
    position: relative;
    z-index: 10;
  }

  .main-area .sec04_point_box {
    margin: 0 auto 5rem;
    width: 101.5rem;
    display: flex;
    justify-content: space-between;
  }

  .main-area .sec04 .point_img04 {
    margin: 0;
    width: 45.8rem;
  }

  .main-area .point_img05 {
    margin: 6rem 0 0 0; 
    width: 49.7rem;
  }

  .main-area .sec04 .item_box {
    width: 47rem;
  }

  .main-area .sec04 .item_img {
    margin-bottom: 2.0rem;
    width: 47rem;
  }

/************** btn **************/
  .main-area .sec_btn {
    margin: 0 auto;
    padding: 8rem 0 7rem;
  }

  .main-area .sec_btn a {
    margin: 0 auto;
    font-size: 1.3rem;
    letter-spacing: 0.05em;
    font-weight: 600;
    width: 36rem;
    max-width: 36rem;
    height: 6rem;
    max-height: 6rem;
    background-color: transparent;
    font-family:var(--noto-sans);
  }

  .main-area .sec_btn a:last-child {
    margin-top: 2rem;
  }

}



/* パンくず 追加スタイル PC */
@media only screen and (min-width: 768px) {
  .breadcrumb__list{
    padding-bottom: 1.6rem;
  }
}

