@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,500;0,700;1,500&family=Noto+Sans+JP:wght@300;400;700&display=swap');

html {
    font-size: 62.5%;
    -webkit-overflow-scrolling: touch;
    scroll-padding-top: 115px;
}


body {
    font-family:  YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

* {
    margin: 0px;
    padding: 0px;
}

@media screen and (max-width: 640px) {
    .br-none{
    display: none;
    }
}

@media screen and (min-width: 640px) {
    .br-sp{
    display: none;
    }
}

img{
    vertical-align:bottom;
}



.top-header {
    background-color:#e6fdfc ;
    position: fixed;
    transition: 0.3s;
    top: 0;
    /* 固定する位置 */
    left: 0;
    /* 固定する位置 */
    right: 0;
    /* 固定する位置 */
    z-index: 9999;
    /*box-shadow: 0 3px 6px rgba(50, 50, 50, 0.3); /*これを付け足し*/
}

.header {
    background-color:#fff ;
    position: fixed;
    transition: 0.3s;
    top: 0;
    /* 固定する位置 */
    left: 0;
    /* 固定する位置 */
    right: 0;
    /* 固定する位置 */
    z-index: 9999;
    /*box-shadow: 0 3px 6px rgba(50, 50, 50, 0.3); /*これを付け足し*/
}

.top-header.change-color {
    background-color: #fff;
    transition: 0.3s;
    box-shadow: 0 0px 30px rgba(50, 50, 50, 0.3);
  }

.header.change-color {
   background-color: #fff;
   transition: 0.3s;
   box-shadow: 0 0px 30px rgba(50, 50, 50, 0.3);
 }
  
.header_box {
    padding: 20px 40px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 768px) {
    .header_box {
        padding: 20px 15px;
    }
}

@media screen and (max-width: 768px) {
    .header_logo {
        width: 40%;
    }
}

.menu-list {
    list-style: none;
    margin: 0;
    display: flex;
 }

 .sp-nav {
    display: none;
 }

.menu_set {
    display: flex;
    align-items: center;
    text-align: right;
    margin: 0 0 0 auto;
}
 @media screen and (max-width: 768px) {
    .menu_set {
       display: none;
    }
    .sp-nav {
       z-index: 1;
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100vh;
       display: block;
       width: 100%;
       background: rgba(0, 0, 0, .8);
       opacity: 0;
       transform: translateY(-100%);
       transition: all .2s ease-in-out;
    }
    #hamburger {
       position: relative;
       display: block;
       width: 30px;
       height: 25px;
       margin: 0 0 0 auto;
    }
    #hamburger span {
       position: absolute;
       top: 50%;
       left: 0;
       display: block;
       width: 100%;
       height: 2px;
       background-color: #3cd2c8;
       transform: translateY(-50%);
    }
    #hamburger::before {
       content: '';
       display: block;
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 2px;
       background-color: #3cd2c8;
    }
    #hamburger::after {
       content: '';
       display: block;
       position: absolute;
       bottom: 0;
       left: 0;
       width: 70%;
       height: 2px;
       background-color: #3cd2c8;
    }
    /*スマホメニュー*/
    .sp-nav ul {
       padding: 0;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       height: 100%;
    }
    .sp-nav li {
       margin: 0;
       padding: 0;
    }
    .sp-nav li span {
       font-size: 15px;
       color: #fff;
    }
    .sp-nav li a, .sp-nav li span {
       display: block;
       padding: 20px 0;
    }
    /*-閉じるアイコンー*/
    .sp-nav .close {
       position: relative;
       padding-left: 20px;
    }
    .sp-nav .close::before {
       content: '';
       position: absolute;
       top: 50%;
       left: 0;
       display: block;
       width: 16px;
       height: 1px;
       background: #fff;
       transform: rotate( 45deg );
    }
    .sp-nav .close::after {
       content: '';
       position: absolute;
       top: 50%;
       left: 0;
       display: block;
       width: 16px;
       height: 1px;
       background: #fff;
       transform: rotate( -45deg );
    }
    .toggle {
       transform: translateY( 0 );
       opacity: 1;
    }
 }

 .menu_btn {
    font-size: 14px;
    color: #3e3e3e;
    font-weight: 500;
    text-decoration: none;
    margin-left: 30px;
}


a.menu_btn_b {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	min-width: 50px;
	margin-left: 25px;
	padding: 1rem 4rem 0.8rem;
        font-size: 13px;
	font-weight: 600;
	border: 2px solid #f3a245;
	background: #f3a245;
	color: #fff;
	border-radius: 100vh;
	transition: 0.5s;
        letter-spacing: 1px;
}
@media screen and (max-width: 768px) {
    a.menu_btn_b {
        margin: 20px;
    }
}
a.menu_btn_b:hover {
	color: #f3a245;
	background: #fff;
}

a.menu_btn_b2 {
	width: 64px;
}

a.menu_btn_c {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 50px;
	margin-left: 10px;
	padding: 1rem 4rem 0.8rem;
    font-size: 13px;
	font-weight: 600;
	border: 2px solid #ed7980;
	background: #ed7980;
	color: #fff;
	border-radius: 100vh;
	transition: 0.5s;
    letter-spacing: 1px;
}
@media screen and (max-width: 768px) {
    a.menu_btn_c {
        margin: 20px;
    }
}
a.menu_btn_c:hover {
	color: #ed7980;
	background: #fff;
}



/*スマホタップ時の枠消し*/
*:focus {
    outline: none;
}


a {
    color:#3e3e3e;
    transition:all 0.5s;
    text-decoration: none;
}
@media screen and (max-width: 640px) {
    a{
    color:#fff;
    }
}

a:hover{
    color:#3cd2c8;
    text-decoration: none;
}

.link-color{
    color:#3e3e3e;
    text-decoration: underline;
}

.link-color:hover{
    color:#3cd2c8;
    text-decoration: none;
}


/*トップ */

.top {
    background: -moz-linear-gradient(top,#e6fdfc 50%, #FFFFFF);
    background: -webkit-linear-gradient(top, #e6fdfc 50%, #FFFFFF);
    background: linear-gradient(to bottom, #e6fdfc 50%, #FFFFFF);
}

.top-container{
    max-width: 980px;
    padding: 130px 30px 50px;
    margin: 0 auto;
}
@media screen and (max-width:1000px) {
    .top-container{
        padding: 100px 30px 0px;
    }
}

.main{
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
}
@media screen and (max-width: 1000px) {
    .main {
        flex-direction: column-reverse;
        padding: 0px 0px;
        text-align: center;
    }
}

.main_left{
    margin: 50px 50px 0 0;
}
@media screen and (max-width: 1000px) {
    .main_left{
    margin:0 auto 0px;
    }
}

.title{
    font-size:43px;
    font-weight: 600;
    line-height: 47px;
    margin-bottom: 40px;
    color: #3cd2c8;
    text-align: center;
}
@media screen and (max-width: 960px) {
    .title{
    font-size:30px;
    line-height: 37px;
    margin-bottom: 10px;
    }
}

.title-50{
    font-size:60px;
}
@media screen and (max-width: 768px) {
    .title-50{
    font-size:40px;
    }
}

.title-annotation-mark{
    font-size:14px;
}

.title-annotation{
    color:#3e3e3e;
    font-size:11px;
    text-align: right;
    margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
    .title-annotation{
    font-size:10px;
    margin-bottom: 20px;
    text-align: center;
    }
}

.main_logo{
    width: 100%;
    margin:0 auto 20px;
    color:#3e3e3e;
}
@media screen and (max-width: 768px) {
    .main_logo{
    width: 90%;
    }
}

.catch-popy-set{
    display: flex;
    align-items: center;
    padding:0px 0 20px;
}
@media screen and (max-width: 768px) {
    .catch-popy-set{
        padding:0px 0 5px;
    }
}

.eye-catch{
    display: inline-block;
    width: 70px;
    height: 70px;
    color:#3e3e3e;
    border:solid 1px #3e3e3e;
    border-radius: 50%;
    background: fff;
    font-size: 16px;
    font-weight: 500;
    text-align:center;
    line-height: 75px;
}
@media screen and (max-width: 768px) {
    .eye-catch{
    width: 60px;
    height: 60px;
    font-size: 14px;
    line-height: 63px;
    }
}

.top-copy_a{
    font-size: 33px;
    font-weight: 600;
    line-height: 40px;
    letter-spacing:2px;
    margin: 0 0px 0 15px;
    color:#3e3e3e;
}
@media screen and (max-width: 768px) {
    .top-copy_a{
    font-size: 24px;
    font-weight: 600;
    line-height: 30px;
    text-align: left;
    margin: 0px 0 0 10px;
    }
}

.app-web{
    margin: 0 0 20px;
    line-height: 28px;
    padding:20px 0 20px;
    border-top:solid 1px #3e3e3e;
    border-bottom:solid 1px #3e3e3e;
}
@media screen and (max-width: 768px) {
    .app-web{
    padding:15px 0 15px;
    margin: 10px 0 15px;
    }
}

@media screen and (max-width: 960px) {
    .top-copy_b{
    padding:15px 0;
    margin:10px 60px 25px;
    line-height: 25px;
    }
}
@media screen and (max-width: 640px) {
    .top-copy_b{
    font-size: 20px;
    padding:15px 0;
    margin:10px 20px 30px;
    line-height: 25px;
    }
}

.g-mark{
    width:230px;
    margin-right: 15px;
}
@media screen and (max-width: 1000px) {
    .g-mark{
    margin: 40px auto 0;
    }
}
@media screen and (max-width: 640px) {
    .g-mark{
    width: 80%;
    margin: 10px auto 0;
    }
}

.g-mark_annotation{
    color:#3e3e3e;
    font-size:11px;
    margin-top: 5px;
}

.it-img{
    margin-top: 20px;
}
@media screen and (max-width: 640px) {
    .it-img{
    width: 90%;
    margin-top: 5px;
    }
}

@media screen and (max-width: 1000px) {
    .main_right{
    margin:0 auto;
    }
}

.main_img{
    width: 500px;
    align-items: center;
}
@media screen and (max-width: 1000px) {
    .main_img{
    margin-bottom: 40px;
    }
}
@media screen and (max-width: 640px) {
    .main_img{
    width: 95%;
    margin-bottom: 5px;
    }
}


/* アプリダウンロード*/
.dl-wrapper{
    margin:10px 30px 0 0;
    padding: 10px 0 0;
}
@media screen and (max-width: 960px) {
    .dl-wrapper{
    width: 50%;
    flex-direction: column;
    text-align: center;
    }
}
@media screen and (max-width: 767px) {
    .dl-wrapper{
        margin: 0px auto;
    }
}
@media screen and (max-width: 640px) {
    .dl-wrapper{
        margin: 0px auto 50px;
    }
}

@media screen and (max-width: 960px) {
    .furari-logo{
    margin-bottom: 10px;
    }
}
@media screen and (max-width: 640px) {
    .furari-logo{
    margin-bottom: 5px;
    }
}

.app-furari-logo{
    vertical-align: bottom;
}
@media screen and (max-width: 640px) {
    .app-furari-logo{
    width:100%;
    }
}

.dl-container{
    display: flex;
    margin:10px 30px 0 0;
    padding: 10px 0 0;
}
@media screen and (max-width: 960px) {
    .dl-container{
    flex-direction: column;
    margin: 10px auto 0;
    text-align: center;
    }
}

.dl-banner-set{
    margin-left: 20px;
}
@media screen and (max-width: 960px) {
    .dl-banner-set{
    margin:0 auto;
    }
}

.dl-text{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 3px;
    text-align: center;
}
@media screen and (max-width: 640px) {
    .dl-text{
    font-size: 16px;
    margin-top:10px;
    }
}

.dl-app-btn{
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 640px) {
    .dl-app-btn{
    flex-direction: column;
    margin: 8px 0 0px;
    }
}

.dl-app{
    margin-right: 10px;
}
@media screen and (max-width: 640px) {
    .dl-app{
    flex-direction: column;
    margin:0 auto 5px;
    }
}

@media screen and (max-width: 640px) {
    .google{
    flex-direction: column;
    margin:0 auto;
    }
}


/*ビデオ */
.video-wrapper{
    background-color: #fbfbfb;
    background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
    background-size: 14px 14px;
    background-repeat: repeat;
    background-position: center center;
    text-align: center;
    margin: 60px auto 130px;
    padding:100px 0 100px;
}
@media screen and (max-width: 960px) {
    .video-wrapper{
    padding: 30px;
    margin: 0px auto ;
    }
}

.video-title{
    width:350px;
    margin-bottom:20px;
}
@media screen and (max-width: 640px) {
    .video-title{
    width:230px;
    margin-bottom:15px;
    }
}

.video-container {
    max-width: 800px;
    margin:0 auto;
    width: 100%;
    aspect-ratio: 16 / 9;
  }
  
  .video-container iframe {
    width: 100%;
    height: 100%;
    border-radius: 20px;
  }


/*ビデオ（アプリ用） */
.video-app-wrapper{
    ackground-color: #fbfbfb;
    background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
    background-size: 14px 14px;
    background-repeat: repeat;
    background-position: center center;
    text-align: center;
    margin: 0px auto 30px;
    padding:150px 0 130px;
}
@media screen and (max-width: 960px) {
    .video-app-wrapper{
    padding: 180px 30px 30px;
    margin: 0px auto ;
    }
}

.video-app-container {
    max-width: 800px;
    margin:0 auto;
    width: 100%;
    aspect-ratio: 16 / 9;
  }
  
  .video-app-container iframe {
    width: 100%;
    height: 100%;
    border-radius: 20px;
  }


/*フラリとは */

.about{
    max-width: 980px;
    display: flex;
    margin: 0px auto 50px;
    align-items: center;
}
@media screen and (max-width: 1000px) {
    .about{
    margin: 100px auto 50px;
    padding: 0 30px 0;
    }
}
@media screen and (max-width: 768px) {
    .about{
    margin: 30px auto 40px;
    }
}


.about-img{
    margin: 0 90px 0 0px;
}
@media screen and (max-width: 960px) {
    .about-img{
    margin: 0 40px 0 0;
    }
}
@media screen and (max-width: 767px) {
    .about-img{
    width: 90%;
    margin: 0 20px 0 0;
    }
}
@media screen and (max-width: 640px) {
    .about-img{
    display: none;
    }
}

.whats_furari{
    font-family: 'Montserrat', sans-serif;
    font-style: italic;
    font-size: 13px;
    font-weight:500;
    color: #3cd2c8;
}
@media screen and (max-width: 640px) {
    .whats_furari{
    text-align: center;
    margin-bottom: 10px;
    }
}

.about-title{
    font-size: 28px;
    font-weight: 700;
    margin: 15px 0 0;
    line-height: 44px;
    color:#3e3e3e;
}
@media screen and (max-width: 767px) {
    .about-title{
    font-size: 26px;
    margin: 40px 0 0;
    line-height: 37px;
    }
}
@media screen and (max-width: 640px) {
    .about-title{
    font-size: 21px;
    margin: 0px 0 0;
    line-height: 30px;
    }
}

.about-text{
    font-weight:400 ;
    margin-top: 15px;
    font-size: 17px;
    line-height: 30px;
    color:#3e3e3e;
}
@media screen and (max-width: 767px) {
    .about-text{
    margin-top: 10px;
    font-size: 16px;
    line-height: 25px;
    }
}

/*フラリが選ばれる理由 */
.choice{
    max-width: 980px;
    margin:0 auto 130px;
}
@media screen and (max-width: 1000px) {
    .choice{
    padding: 0 30px;
    margin:0 auto 150px;
    }
}
@media screen and (max-width: 500px) {
    .choice{
    margin:0 auto 70px;
    }
}

.choice_title{
    text-align: center;
    color:#fff;
    font-size: 26px;
    font-weight: 600;
    background-color: #3cd2c8;
    padding: 13px 0 8px;
    border:2px solid #3cd2c8;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    letter-spacing: 5px;
}
@media screen and (max-width: 640px) {
    .choice_title{
    font-size: 20px;
    padding: 5px 0;
    letter-spacing: 2px;
    }
}

.reason{
    list-style-type: none;
    padding:0 50px;
    border:2px solid #3cd2c8;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}
@media screen and (max-width: 1000px) {
    .reason{
    flex-direction: column;
    text-align: center;
    padding: 0px 30px;
    }
}

.reason-box{
    display: flex;
    padding: 30px 0px;
}
@media screen and (max-width: 1000px) {
    .reason-box{
    flex-direction: column;
    padding: 30px 0;
    }
}

.reason-box-line{
    display: flex;
    padding:30px 0px;
    border-top: 1px solid #3cd2c8;
}
@media screen and (max-width: 1000px) {
    .reason-box-line{
    flex-direction: column;
    border-top: 1px solid #3cd2c8;
    padding: 30px 0;
    }
}

.reason-photo{
    width: 180px;
}
@media screen and (max-width: 640px) {
    .reason-photo{
    width:100%;
    margin-bottom:10px;
    }
}

.reason-text-box{
    margin: 0 0px 0 20px;
}
@media screen and (max-width: 1000px) {
    .reason-text-box{
    margin: 0 0px;
    }
}

.reason-title{
    font-size: 19px;
    text-align: left;
    font-weight: 600;
    margin-bottom: 5px;
    color:#3e3e3e;
    letter-spacing: 1px;
}
@media screen and (max-width: 1000px) {
    .reason-title{
    text-align: center;
    }
}

.reason-text{
    font-size: 15px;
    font-weight:400;
    line-height: 25px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .reason-text{
    font-size: 14px;
    line-height: 1.7;
    }
}

/*アンケート */
.survey-wrapper{
    max-width: 980px;
    margin:0 auto 50px;
}

.survey-title{
    font-size: 25px;
    font-weight: 600;
    text-align: center;
    color:#3e3e3e;
    margin-bottom:55px;
}
@media screen and (max-width: 640px) {
    .survey-title{
    margin:100px 30px 30px;
    padding: 10px 10px;
    border:1px solid #323232;
    }
}

.survey-title-border{
    border:1px solid #323232;
    padding: 10px 15px;
}
@media screen and (max-width: 640px) {
    .survey-title-border{
    border:0px;
    }
}

.survey-graph-contents{
    display: flex;
    justify-content: space-around;
}
@media screen and (max-width: 1000px) {
    .survey-graph-contents{
    flex-direction: column;
    }
}

.survey-graph-box, .survey-graph-box-b{
    text-align: center;
}
@media screen and (max-width: 1000px) {
    .survey-graph-box{
    border-bottom: 1px solid #a4a4a4;
    padding-bottom: 50px;
    margin: 0px 30px 50px;
    }
}

.survey-graph-title{
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: #3e3e3e;
    margin-bottom: 25px;
}
@media screen and (max-width: 640px) {
    .survey-graph-title{
    font-size: 18px;
    }
}

.custumer-voice-wrapper{
    max-width: 880px;
    margin:0 auto 130px;
    padding: 50px 25px;
    background-color: #F5F5F5;
    border-radius: 30px;
}
@media screen and (max-width: 1000px) {
    .custumer-voice-wrapper{
    margin:0 30px 170px;
    padding: 50px 10px 10px;
    }
}
@media screen and (max-width: 640px) {
    .custumer-voice-wrapper{
    margin:0 30px 70px;
    }
}

.custumer-voice-title{
    text-align: center;
    margin-bottom: 50px;
}
@media screen and (max-width: 1000px) {
    .custumer-voice-title{
        margin-bottom: 30px;
    }
}

.custumer-voice-content-box{
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 1000px) {
    .custumer-voice-content-box{
    flex-direction: column;
    }
}

.custumer-voice-box{
    width: 100%;
    background: #ffffff;
    margin:0 25px 0;
    padding:100px 30px 30px;
    border-radius: 15px;
    position: relative;
}
@media screen and (max-width: 1000px) {
    .custumer-voice-box{
    width: auto;
    margin: 25px;
    }
}

.custumer-voice-img{
    position: absolute;
    top:-30px;
    left:50%;
    transform:translate(-50%, 0);
}

.custumer-voice-text{
    font-size: 13px;
    color:#3e3e3e;
    line-height: 23px;
}

/*スタンプ＆特典 */
.contents_wrapper{
    padding:130px 0 50px;
    background-color:#ecfcfc;
    position: relative;
}
@media screen and (max-width: 1000px) {
    .contents_wrapper{
    padding:150px 0 30px;
    }
}
@media screen and (max-width: 500px) {
    .contents_wrapper{
    padding:50px 0 30px;
    }
}


/*スタンプ＆特典 */
.basic-function-wrapper{
    max-width: 980px;
}

.basic-function-title-box{
    max-width: 980px;
    padding: 0 30px;
    margin: 0 auto 40px;
    text-align: center;
}

.basic_operation_icon{
    width: 55px;
    margin:0 auto;
}

.basic_operation_s-title{
    font-size:16px;
    font-weight: 500;
}

.basic-function-main-title{
    font-size:30px;
    font-weight: 600;
    color:#3cd2c8;
    margin-bottom:15px;
    line-height: 40px;
    letter-spacing: 3px;
}
@media screen and (max-width: 767px) {
    .basic-function-main-title{
    font-size: 35px;
    margin-bottom:5px;
    }
}
@media screen and (max-width: 640px) {
    .basic-function-main-title{
    font-size: 25px;
    margin-bottom:5px;
    letter-spacing: 2px;
    }
}

.basic-function-sub-title{
    font-size: 16px;
    font-weight: 500;
    color:#3e3e3e;
    margin-bottom: 25px;
    line-height: 26px;
}
@media screen and (max-width: 767px) {
    .basic-function-sub-title{
    font-size: 18px;
    margin-bottom: 15px;
    line-height: 23px;
    }
}
@media screen and (max-width: 640px) {
    .basic-function-sub-title{
    font-size: 14px;
    margin-bottom: 5px;
    }
}


.basic-function-operation-container_line{
    max-width: 980px;
    margin: 0 auto 70px;
    padding-bottom: 70px;
    display: flex;
    justify-content: space-around;
    border-bottom: 1px solid #C1C1C1;
}
@media screen and (max-width: 960px) {
    .basic-function-operation-container_line{
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 30px;
    margin: 0 30px 50px;
    }
}

.basic-function-operation-container{
    max-width: 980px;
    margin: 0 auto 80px;
    display: flex;
    justify-content: space-around;
}
@media screen and (max-width: 960px) {
    .basic-function-operation-container{
    display: flex;
    flex-wrap: wrap;
    margin: 0 30px 30px;
    }
}

.basic-function-operation-box{
    text-align: center;
    margin: 0 30px;
    width: 260px;
}
@media screen and (max-width: 960px) {
    .basic-function-operation-box{
    width:100%;
    margin: 0 0px 40px;
    }
}

.basic-function-operation-stamp-box{
    text-align: center;
    margin: 0 5px;
    width: 210px;
}
@media screen and (max-width: 960px) {
    .basic-function-operation-stamp-box{
    width:100%;
    margin: 0 0px 40px;
    }
}

.check-point-img{
    height: 300px;
}

.choose-stamp-img, .benefits-img{
    width: 180px;
}

.basic-function-operation-text-title{
    font-size: 19px;
    font-weight: 600;
    color:#3e3e3e;
    text-align: center;
    margin: 15px 0 10px;
}
@media screen and (max-width: 640px) {
    .basic-function-operation-text-title{
    margin: 10px 0 3px;
    }
}

.basic-function-operation-text{
    font-size: 14px;
    text-align: left;
    line-height: 21px;
    color:#3e3e3e;
}
@media screen and (max-width: 768px) {
    .basic-function-operation-text{
        text-align: center;
    }
}

.annotation-d{
    display: block;
    font-size: 12px;
    line-height: 17px;
    margin-top: 5px;
    color:#3e3e3e;
}


.basic-function-benefits-box{
    max-width: 980px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
@media screen and (max-width: 1000px) {
    .basic-function-benefits-box{
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 100px;
    margin: 0 30px;
    }
}
@media screen and (max-width: 640px) {
    .basic-function-benefits-box{
    padding-bottom: 0px;
    }
}

.basic-function{
    width: 360px;
    background-color: #fff;
    margin: 25px;
    padding: 40px;
    border-radius: 20px;
    text-align: center;
    filter: drop-shadow(8px 8px 8px rgba(0, 0, 0, 0.1));
}
@media screen and (max-width: 640px) {
    .basic-function{
    margin: 15px 0;
    padding: 30px;
    }
}

.basic-function-title{
    font-size: 22px;
    font-weight: 600;
    margin:15px 0 5px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .basic-function-title{
    font-size: 18px;
    line-height: 25px;
    }
}

.basic-function-text{
    font-size: 16px;
    text-align: left;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .basic-function-text{
    font-size: 14px;
    line-height: 20px;
    }
}

/*FEATURE/特典 */

.feature-wrapper{
    max-width: 980px;
    padding: 130px 0 50px;
    margin: 0px auto;
}
@media screen and (max-width: 1000px) {
    .feature-wrapper{
    padding:0 30px;
    margin-top: 130px;
    }
}
@media screen and (max-width: 500px) {
    .feature-wrapper{
    padding:0 30px;
    margin-top: 70px;
    }
}

.feature-title-box{
    text-align: center;
    margin-bottom: 100px;
}
@media screen and (max-width: 640px) {
    .feature-title-box{
        margin-bottom: 50px;
    }
}

.feature-title{
    font-family: 'Montserrat', sans-serif;
    font-size:40px;
    font-weight: 700;
    color:#3cd2c8;
    letter-spacing: 2px;
    margin-bottom:2px;
}
@media screen and (max-width: 640px) {
    .feature-title{
    font-size: 35px;
    }
}

.feature-title-jp{
    font-size:20px;
    font-weight: 600;
    color:#3e3e3e;
}

.feature-contents-left, .feature-contents-right{
    display: flex;
    justify-content: space-between;
    margin-bottom: 80px;
    padding: 0 0 80px;
    border-bottom: solid 1px #a4a4a4;
}
@media screen and (max-width: 960px) {
    .feature-contents-left{
    flex-direction: column;
    }
}
@media screen and (max-width: 640px) {
    .feature-contents-left{
    flex-direction: column;
    padding: 0 0 50px;
    margin-bottom: 50px;
    }
}
@media screen and (max-width: 960px) {
    .feature-contents-right{
    flex-direction: column-reverse;
    }
}
@media screen and (max-width: 640px) {
    .feature-contents-right{
    flex-direction: column-reverse;
    padding: 0 0 50px;
    margin-bottom: 50px;
    }
}

.feature-contents-right_b{
    display: flex;
    justify-content: space-between;
    margin-bottom: 100px;
}
@media screen and (max-width: 960px) {
    .feature-contents-right_b{
    flex-direction: column-reverse;
    }
}
@media screen and (max-width: 640px) {
    .feature-contents-right_b{
    flex-direction: column-reverse;
    margin-bottom: 80px;
    }
}

.feature-img-left{
    margin-right: 50px;
}
@media screen and (max-width: 960px) {
    .feature-img-left{
    text-align: center;
    margin: 0 0px 20px;
    }
}

.img-left{
    width: 430px;
}
@media screen and (max-width: 960px) {
    .img-left{
    width: 70%;
    }
}
@media screen and (max-width: 640px) {
    .img-left{
    width: 90%;
    }
}
.feature-img-right{
    margin-left: 50px;
}
@media screen and (max-width: 960px) {
    .feature-img-right{
    text-align: center;
    margin: 0 0px 20px;
    }
}

.img-right{
    width: 430px;
}
@media screen and (max-width: 960px) {
    .img-right{
    width: 70%;
    }
}
@media screen and (max-width: 640px) {
    .img-right{
    width: 90%;
    }
}

.feature-content-title-box{
    margin: 0 0 25px;
    border-left:4px solid #3cd2c8;
    padding: 3px 0 0 10px;
}
@media screen and (max-width: 960px) {
    .feature-content-title-box{
    text-align: center;
    margin: 0 0 15px;
    border-left:none;
    }
}
@media screen and (max-width: 960px) {
    .feature-content-title-box{
    margin: 0 0 5px;
    }
}

.feature-contents-no{
    font-family: 'Montserrat', sans-serif;
    font-size:14px;
    font-weight: 500;
    color:#3cd2c8;
    letter-spacing: 1px;
    margin-bottom: 5px;
}
@media screen and (max-width: 640px) {
    .feature-contents-no{
        font-size: 14px;
        margin-bottom: 2px;
    }
}

.feature-content-title{
    font-size: 26px;
    font-weight: 600;
    letter-spacing: 2px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .feature-content-title{
        font-size: 25px;
        margin-bottom: 7px;
    }
}

.feature-content-text{
    font-size:16px;
    line-height:28px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .feature-content-text{
        font-size: 14px;
        line-height:22px;
    }
}

.annotation{
    color:#3e3e3e;
    font-size:10px;
    margin-top: 15px;
}


.feature-other-text-container{
}
@media screen and (max-width: 960px) {
    .feature-other-text-container{
    text-align: center;
    }
}

.feature-other-text-box{
    margin:0 0 10px 15px;
}

.feature-other-text-title{
    font-size: 16px;
    font-weight: 600;
    color:#3e3e3e;
}

.feature-other-example-text{
    font-size: 13px;
    color:#3e3e3e;

}

@media screen and (max-width: 960px) {
    .ul-none{
        list-style: none;
    }
}

.text-img{
    text-align: center;
    margin: 30px auto 0;
}

.feature-img-appxweb-figure{
    width:70%;
}
@media screen and (max-width: 960px) {
    .feature-img-appxweb-figure{
        width:100%;
    }
}

/*アプリ画面イメージ */

.slider-wrapper{
    background-color: #fff;
    padding: 100px 50px 120px;
}
@media screen and (max-width: 960px) {
    .slider-wrapper{
        padding: 80px 0px 50px;
    }
}
@media screen and (max-width: 640px) {
    .slider-wrapper{
        padding: 40px 0px 50px;
    }
}

.slider-contents{
    margin: 0 auto;
}

.screen-title{
    font-family: 'Montserrat', sans-serif;
    font-size:40px;
    font-weight: 700;
    color:#52a5dc;
    letter-spacing: 2px;
    margin-bottom:2px;
}
@media screen and (max-width: 640px) {
    .screen-title{
    font-size: 35px;
    line-height: 40px;
    margin-bottom: 10px;
    }
}

.screen-img-title-box{
    text-align: center;
    margin-bottom: 40px;
}
@media screen and (max-width: 640px) {
    .screen-img-title-box{
        margin-bottom: 0px;
    }
}

.screen-img-title{
    font-size:40px;
    font-weight: 800;
    color:#fff;
    letter-spacing: 2px;
}

.screen-img-wrapper{
    margin: 0 auto;
    padding: 30px 0;
    text-align: center;
}
@media screen and (max-width: 1400px) {
    .screen-img-wrapper{
        padding: 30px 0 10px;
    }
}

/*prev,nextボタン画像 */
.slick-prev::before {
    content: url(../furari_images/slide-arrow-prev.png);  
}
.slick-next::before {
     content: url(../furari_images/slide-arrow-next.png); 
}

/*prev,nextボタン位置 */
.slick-prev{
    left: 20px;
    z-index: 100;
}
.slick-next{
    right: 20px;
}


.pict{
    margin: 0 auto;
    width: 250px;
    filter: drop-shadow(10px 10px 15px rgba(0,0,0,0.3));
    border-radius: 20px;
}
@media screen and (max-width: 1400px) {
    .pict{
        width: 100%;
    }
}
@media screen and (max-width: 640px) {
    .pict{
        width: 70%;
        filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.2));
    }
}

.slick-slide {
    transition: .3s ease;
    transform: scale(.70);
}

.slick-current {
    transform: scale(1);
}


.slick-slide:not(.slick-current) {
    opacity: .6;
}
@media screen and (max-width: 640px) {
    .slick-slide:not(.slick-current){
        opacity: none;
    }
}


.slider-text{
    font-size: 1.6rem;
    font-weight: 500;
    margin-top: 20px;
}
@media screen and (max-width: 640px) {
    .slider-text{
        font-size: 1.2rem;
    }
}


/*開催までの流れ */
.flow-wrapper{
    padding:130px 30px 0px;
    background-color: #fbfbfb;
    background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
    background-size: 14px 14px;
    background-repeat: repeat;
    background-position: center center;
}
@media screen and (max-width: 960px) {
    .flow-wrapper{
        padding:180px 30px 0px ;
    }
}
@media screen and (max-width: 767px) {
    .flow-wrapper{
        padding:160px 30px 0px ;
    }
}
@media screen and (max-width: 640px) {
    .flow-wrapper{
        padding:70px 30px 0px ;
    }
}

.flow-main-wrapper{
    max-width: 980px;
    margin:0 auto;
    padding-bottom: 130px;
}
@media screen and (max-width: 1000px) {
    .flow-main-wrapper{
        padding-bottom: 100px;
    }
}
@media screen and (max-width: 640px) {
    .flow-main-wrapper{
        padding-bottom: 70px;
    }
}

.flow-title-box{
    margin-bottom: 50px;
}

.flow-title, .price-title{
    font-size:38px;
    font-weight: 600;
    color:#3e3e3e;
    margin-bottom:10px;
    text-align: center;
}
@media screen and (max-width: 767px) {
    .flow-title, .price-title{
        font-size:35px;
    }
}
@media screen and (max-width: 640px) {
    .flow-title, .price-title{
        font-size:25px;
        line-height: 33px;
    }
}

.flow-title-text{
    font-size:16px;
    font-weight: 500;
    text-align: center;
}
@media screen and (max-width: 640px) {
    .flow-title-text{
        font-size:14px;
    }
}

.flow-contents-box{
    display: flex;
    background-color:#fff;
    padding:25px;
    border-radius: 30px;
    align-items: center;
    filter: drop-shadow(8px 8px 8px rgba(0, 0, 0, 0.1));
}
@media screen and (max-width: 767px) {
    .flow-contents-box{
        flex-direction: column;
    }
}

.flow-contents-text{
    font-size: 15px;
    line-height: 26px;
    color:#3e3e3e;
}
@media screen and (max-width: 767px) {
    .flow-contents-text{
        font-size: 14px;
    }
}

.flow-contents{
    margin-left: 30px;
}
@media screen and (max-width: 767px) {
    .flow-contents{
        margin-left: 0px;
    }
}

.flow-contents-title{
    font-size: 22px;
    font-weight: 600;
    color:#3e3e3e;
    margin: 5px 0;
    letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
    .flow-contents-title{
        text-align: center;
    }
}
@media screen and (max-width: 640px) {
    .flow-contents-title{
        font-size: 22px;
    }
}

.arrow{
    text-align: center;
    margin: 15px 0 10px;
}


/*サポート */
.support-wrapper{
    padding:80px 30px 0px;
    background-color:#3cd2c8;
}
@media screen and (max-width: 1000px) {
    .support-wrapper{
    padding:80px 30px 0px;
    }
}

.support-main-wrapper{
    max-width: 980px;
    margin:0 auto;
    padding-bottom: 60px;
}
@media screen and (max-width: 1000px) {
    .support-main-wrapper{
    padding-bottom: 50px;
    }
}

.support-icon{
    text-align: center;
    margin-bottom: 40px;
}

.support-title{
    font-size:30px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 20px;
    line-height: 43px;
    letter-spacing: 2px;
    color:#FFFBD1;
}
@media screen and (max-width: 1000px) {
    .support-title{
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 0px;
    }
}

.support-contents-wrapper{
    padding: 30px;
    background: #fff;
    border-radius: 30px;
}
@media screen and (max-width: 1000px) {
    .support-contents-wrapper{
    padding:20px;
    }
}

.support-contents{
    display: flex;
    justify-content: space-between;
    padding-bottom: 30px;
    border-bottom: 1px solid #D5D5D5;
}
@media screen and (max-width: 1000px) {
    .support-contents{
    flex-direction: column;
    padding-bottom: 5px;
    }
}

.support-contents-box{
    width: 207px;
    padding-right: 15px;
    border-right:1px dotted #D5D5D5;
}
@media screen and (max-width: 1000px) {
    .support-contents-box{
    width: 100%;
    border:none;
    }
}

.support-contents-box-b{
    width: 207px;
}
@media screen and (max-width: 1000px) {
    .support-contents-box-b{
    width: 100%;
    }
}

@media screen and (max-width: 1000px) {
    .support-contents-text-box{
    margin-bottom: 15px;
    }
}


.support-bullets{
    padding-left: 15px;
}

.support-contents-title{
    color:#fff;
    font-size:16px;
    font-weight:500;
    text-align: center;
    padding: 5px 0 1px;
    margin-bottom: 12px;
    background-color: #3cd2c8;
    border-radius: 20px;
}

.support-contents-text{
    font-size:14px;
    font-weight: 500;
    margin-top: 8px;
    line-height: 20px;
    color:#3e3e3e;
}

.support-annotation{
    font-size: 9px;
    color:#3e3e3e;
}

.support-sub-contents-container{
    margin-top: 30px;
}
@media screen and (max-width: 1000px) {
    .support-sub-contents-container{
    margin-top: 10px;
    }
}

.support-sub-title{
    font-size: 23px;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: center;
    color:#3cd2c8;
}

@media screen and (max-width: 640px) {
    .support-free-title{
    width: 100%;
    }
}

.support-sub-contents-text{
    font-size: 15px;
    font-weight: 500;
    margin:2px 10px;
    color:#3e3e3e;
}

.support-sub-contents-text-box-b{
    margin-top: 10px;

}

.form-title-box{
    margin-bottom: 50px;
}
@media screen and (max-width: 640px) {
    .form-title-box{
        margin-bottom: 0px;
    }
}



/* 料金 */

.other-page-body{
    background-color: #fff;
    padding: 150px 30px 120px;
}
@media screen and (max-width: 960px) {
    .other-page-body {
        padding: 120px 30px 100px;
    }
}
@media screen and (max-width: 767px) {
    .other-page-body {
        padding: 120px 30px 50px;
    }
}
@media screen and (max-width: 640px) {
    .other-page-body {
        padding: 50px 30px 30px;
    }
}

.other-page-main {
    max-width: 980px;
    margin: 0px auto;
}

.plan_title {
    font-size: 19px;
    font-weight: 500;
    color: #3e3e3e;
    line-height: 25px;
    margin: 40px 0 10px;
}

.plan_subtitle {
    font-size: 14px;
    font-weight: 600;
}

@media screen and (max-width: 640px) {
    .plan_subtitle {
        font-size: 12px;
        line-height: 10px;
    }
}

table {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 5px;
}

@media screen and (max-width: 640px) {
    table {
        margin-bottom: 20px;
    }
}

.table_title {
    background: #a7a7a7;
}

th {
    color: #fff;
    border: 1px solid #767676;
    font-size:1.4rem;
    padding: 4px 0 2px;
}

.th-border{
    border-right: 1px solid #fff;
    font-size:1.4rem;
    padding: 4px 0 2px;
}

.td_a {
    background: #fff;
    padding: 13px 10px 10px;
    border: 1px solid #767676;
}

.td_b {
    background: #fff;
    padding: 10px 10px 10px 30px;
    border: 1px solid #767676;
}
@media screen and (max-width: 640px) {
    .td_b{
    padding: 10px 10px 10px 10px;
    }
}

.contents {
    font-size: 15px;
    font-weight: 500;
    color:#3e3e3e;
}

.price {
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .price {
        font-size: 15px;
    }
}

.estimate {
    font-size: 16px;
    font-weight: 500;
}
@media screen and (max-width: 640px) {
    .estimate {
        font-size: 15px;
    }
}

.quantity {
    font-size: 14px;
    color: #3e3e3e;
    font-weight: 500;
}

@media screen and (max-width: 640px) {
    .quantity {
        font-size: 12px;
    }
}

.supplement {
    font-size: 14px;
    color:#3e3e3e;
}

@media screen and (max-width: 640px) {
    .supplement {
        font-size: 12px;
    }
}

.annotation-b{
    font-size:12px;
    margin-bottom: 70px;
}
@media screen and (max-width: 640px) {
    .annotation-b{
        font-size: 10px;
    }
}

.annotation-c{
    font-size:13px;
    margin-top: 5px;
    line-height: 18px;
}
@media screen and (max-width: 640px) {
    .annotation-c{
        font-size: 11px;
        line-height: 16px;
    }
}

.pakage-plan_title-container{
    display:flex;
    margin: 70px auto 10px;
    align-items: flex-end;
}
@media screen and (max-width: 640px) {
    .pakage-plan_title-container{
        margin-bottom:10px;
        flex-direction: column;
        align-items: stretch;
    }
}

.pakage-plan_title{
    font-size:20px;
    font-weight: 600;
}

.pakage-plan_sub-title{
    font-size: 16px;
    margin:5px 40px 0px 0;
    line-height: 23px;
}
@media screen and (max-width: 640px) {
    .pakage-plan_sub-title{
        font-size: 13px;
        margin:0px 0px 10px 0;
        line-height: 19px;
    }
}

.pakageplan-table_title{
    background-color: #3cd2c8;
}

.pakageplan-th-title{
    font-size: 28px;
    font-weight: 600;
    padding: 23px 70px 15px;
    border-right: 1px solid #3e3e3e;
    line-height: 23px;
}
@media screen and (max-width: 960px) {
    .pakageplan-th-title {
        padding: 23px 30px 15px;
    }
}
@media screen and (max-width: 640px) {
    .pakageplan-th-title {
        padding: 23px 5px 15px;
        font-size: 16px;
    }
}

.pakageplan-th-title_b{
    font-size: 16px;
    font-weight: 500;
    padding: 10px;
    border-right: 1px solid #3e3e3e;
}

.pakageplan-th-under-text{
    font-size:14px;
    font-weight: 500;
}
@media screen and (max-width: 640px) {
    .pakageplan-th-under-text {
        display: block;
        font-size: 12px;
        line-height: 16px;
    }
}

.pakage-price {
    font-size: 25px;
    font-weight: 600;
    text-align: center;
}
@media screen and (max-width: 640px) {
    .pakage-price {
        font-size: 15px;
    }
}

.pakage-supplement {
    font-size: 17px;
    font-weight: 400;
}

@media screen and (max-width: 640px) {
    .pakage-supplement {
        font-size: 12px;
    }
}

.pakage-th-border{
    padding: 5px;
}

.pakage-td_a {
    text-align: center;
    background: #fff;
    padding: 15px 10px 12px;
    border: 1px solid #3e3e3e;
}

.jump-text {
    position: relative;
    display: block;
    margin-left: auto;
    max-width: 170px;
    border: 2px solid #3cd2c8;
    font-size: 12px;
    color: #3cd2c8;
    font-weight: 600;
    text-decoration: none;
    padding: 7px 13px 7px 0px;
    border-radius: 20px;
    transition: .4s;
}
@media screen and (max-width: 640px) {
    .jump-text {
        margin:15px auto 0;
    }
}
  
  .jump-text:hover {
    background-color: #3cd2c8;
    color: #FFF;
}

.jump-text:after{
    content: url(../furari_images/page-link.png);
    margin-left: 2px;
    position: absolute;
    top:27%;
}

.it-banner{
    display: block;
    width: 100%;
    margin-top: 5px;
}



/* app x web 料金表 */

.plan_title_box{
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.plan_banner_img{
    width: 90px;
    margin: 0 7px 0px 0;
}

.app_price_plan_title{
    font-size:19px;
    font-weight: 500;
    padding-top: 6px;
    color:#52a5dc;
}

.web_price_plan_title{
    font-size:19px;
    font-weight: 500;
    padding-top: 6px;
    color:#ed7980;
}

.app_table_headline_set{
    background-color: #52a5dc;
}

.web_table_headline_set{
    background-color: #ed7980;
}

.app_table_headline{
    border-right: 1px solid #fff;
    border-top: 1px solid #52a5dc;
    border-bottom: 1px solid #52a5dc;
    border-left: 1px solid #52a5dc;
    font-size:1.6rem;
    font-weight: 500;
    padding: 8px 0 2px;
}

.web_table_headline{
    border-right: 1px solid #fff;
    border-top: 1px solid #ed7980;
    border-bottom: 1px solid #ed7980;
    border-left: 1px solid #ed7980;
    font-size:1.6rem;
    font-weight: 500;
    padding: 8px 0 2px;
}

.app_table_headline_b{
    border: 1px solid #52a5dc;
    font-size:1.7rem;
    font-weight: 500;
    padding: 8px 0 2px;
}

.web_table_headline_b{
    border: 1px solid #ed7980;
    font-size:1.7rem;
    font-weight: 500;
    padding: 8px 0 2px;
}

.app_td_item_set {
    background: #fff;
    padding: 13px 10px 10px;
    border: 1px solid #52a5dc;
}

.web_td_item_set {
    background: #fff;
    padding: 13px 10px 10px;
    border: 1px solid #ed7980;
}

.faq_td_item_set_a {
    background: #e9e9e9;
    padding: 13px 10px 10px;
    border: 1px solid #fff;
}

.faq_td_item_set_b {
    background: #eaf3fe;
    padding: 13px 10px 10px;
    border: 1px solid #fff;
}

.faq_td_item_set_c {
    background: #fff0f2;
    padding: 13px 10px 10px;
    border: 1px solid #fff;
}

.table_item_title{
    font-size:14px;
    font-weight: 500;
    color:#3e3e3e;
}

.table_price{
    display: block;
    font-size:18px;
    font-weight: 600;
    text-align: center;
    color:#3e3e3e;
}

.table_item{
    display: block;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
    color:#3e3e3e;
}

.app_th-box{
    border: 1px solid #52a5dc;
    font-size:1.4rem;
    padding: 4px 0 2px;
}

.web_th-box{
    border: 1px solid #ed7980;
    font-size:1.4rem;
    padding: 4px 0 2px;
}

/* table02 */
#table02 th, #table02 td {
    text-align: center;
    width: 20%;
    min-width: 130px;
  }
  
  /* tab */
  @media only screen and (max-width: 768px) {
    #table02 {
      display: block;
      overflow-x: scroll;
      white-space: nowrap;
    }
  }


/* 制作物受注バナー */
.design-order{
    background-color: #3cd2c8;
}

.dsign-order-contents-top{
    max-width: 980px;
    margin: 0 auto;
    padding: 50px 0 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 960px) {
    .dsign-order-contents-top{
       flex-direction: column-reverse;
       text-align: center;
       padding: 40px 0px 0px;
    }
}

@media screen and (max-width: 640px) {
    .dsign-order-left-img{
       width:100%;
       margin-bottom:10px;
    }
}

@media screen and (max-width: 640px) {
    .dsign-order-right-img{
       width:100%;
       margin-bottom:10px;
    }
}

.dsign-order-contents{
    max-width: 980px;
    margin: 0 auto;
    padding: 50px 0 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 960px) {
    .dsign-order-contents{
       flex-direction: column-reverse;
       text-align: center;
       padding: 40px 30px 40px;
    }
}

@media screen and (max-width: 640px) {
    .dsign-order-left-img{
       width:100%;
       margin-bottom:10px;
    }
}

@media screen and (max-width: 640px) {
    .dsign-order-right-img{
       width:100%;
       margin-bottom:10px;
    }
}

a.portfolio_btn{
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	margin: 20px auto 0;
	padding: 15px 0;
	font-weight: 500;
    font-size: 18px;
	border: 2px solid #ffffff;
	background: #ffffff;
	color: #3cd2c8;
	border-radius: 100vh;
	transition: 0.5s;
}
a.portfolio_btn:hover {
	color: #ffffff;
    border: 2px solid #ffffff;
	background: #3cd2c8;
}
@media screen and (max-width: 960px) {
    a.portfolio_btn{
    font-size:16px;
	margin: 10px auto 0;
    padding: 14px 0 16px;
    }
}


/* 参加方法 */

.entry-wrapper{
    padding:100px 30px;
    background-color:#3cd2c8;
}

.entry-box{
    max-width: 980px;
    margin: 0 auto;
    display: flex;
}
@media screen and (max-width: 1000px) {
    .dl-box{
        flex-direction: column;
    }
}

.dl-right{
    padding-left:50px;
}


.entry-flow-title{
    font-size: 16px;
    font-weight: 600;
    color:#fff;
    margin: 15px 0;
    
}

.entry-flow-box{
    display: flex;
    text-align: center;
}

.entry-text{
    font-size: 10px;
    color:#fff;
    text-align: left;
}

.entry-arrow{
    margin: 0 8px 0;
    line-height: 15;
    
}


/* 開催実績 */

.event_body {
    display: flex;
    flex-wrap: wrap;
}

.event_box {
    width: 298px;
    margin: 0 14px 30px;
}
@media screen and (max-width: 900px) {
    .event_box {
        width: 100%;
        margin: 0px 30px 50px;
    }
}
@media screen and (max-width: 640px) {
    .event_box {
        width: 100%;
        margin: 0px 0px 50px;
    }
}

.past-event-title{
    font-size: 1.8rem;
    font-weight: 600;
    color:#3cd2c8;
    margin:0px 0 0px;
    padding: 0 0 5px;
}
.past-event-title span{
    padding: 0 0 5px;
    border-bottom: 2px solid #3cd2c8;
}
@media screen and (max-width: 640px) {
    .past-event-title{
        font-size:35px;
    }
}
.past-event-title-jp{
}

.event_img {
    text-align: center;
    border-radius: 10px;
    box-shadow: 3px 3px 6px #a4a4a4;
    margin-bottom: 13px;
}
@media screen and (max-width: 640px) {
    .event_img {
        margin-bottom: 7px;
    }
}

.event_title {
    font-size: 16px;
    color: #323232;
    text-align: center;
    line-height: 23px;
    align-items: center;
}
@media screen and (max-width: 900px) {
    .event_title {
        font-size: 20px;
    }
}
@media screen and (max-width: 640px) {
    .event_title {
        line-height: 28px;
    }
}
.event_area {
    font-size: 14px;
    font-weight: 600;
    margin: 3px 0 0px;
    padding-top: 5px;
    border-top: solid 1px #323232;
    color: #323232;
}

@media screen and (max-width: 900px) {
    .event_area {
        text-align: center;
    }
}

@media screen and (max-width: 900px) {
    .genre {
        text-align: center;
    }
}

.event_day {
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 3px;
    color: #323232;
}

@media screen and (max-width: 900px) {
    .event_day {
        text-align: center;
    }
}

@media screen and (max-width: 900px) {
    .genre {
        text-align: center;
    }
}

.genre_text {
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    background-color: #3cd2c8;
    padding: 1px 4px;
    display: inline-block;
}

.event_text {
    font-size: 14px;
    color: #323232;
    margin: 10px 0 5px;
}


/* プライバシーポリシー */

.privacy-title{
    font-size:43px;
    font-weight: 700;
    color:#3cd2c8;
    margin:100px 0 3px;
}
@media screen and (max-width: 640px) {
    .privacy-title {
        font-size:35px;
        line-height: 45px;
    }
}

.article-box{
    margin-top: 40px;
    margin-bottom: 130px;
}

.privacy-text{
    margin-bottom: 10px;
    font-size:15px;
}

.article-title{
    margin: 30px 0 5px;
    font-size:18px;
}

.article-text{
    padding-left: 20px;
    font-size:15px;
}

.ol-style{
    list-style: none;
    padding-left: 20px;
    text-indent: -1.3em;
    font-size:15px;
}

.ul-style{
    margin-left: 10px;
    text-indent: 0em;
}

address{
    margin: 30px 0 50px;
    font-size:15px;
}

.enactment{
    font-size:15px;
    margin-top: 60px;
}



/* トップページ以外のヘッダー部分 */

.other-page-header-body, .other-page-header-body-sp{
    background-color:#3cd2c8;
    padding: 100px 30px 0px;
}
@media screen and (max-width: 960px) {
    .other-page-header-body-sp{
        display: none;
    }
}
.other-page-header-main {
    max-width: 980px;
    margin: 0px auto;
}

.other-page-header-title{
    text-align: left;
    margin-bottom: 40px;
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 960px) {
    .other-page-header-title{
    flex-direction: column;
    text-align: center;
    margin-bottom: 40px;
    }
}
@media screen and (max-width: 640px) {
    .other-page-header-title{
    margin-bottom: 0px;
    }
}

.other-page-en-title{
    font-size:17px;
    font-weight: 500;
    color:#fff;
    margin: 30px 0 -5px;
}
@media screen and (max-width: 640px) {
    .other-page-en-title{
    font-size:15px;
    margin: 0px 0 -5px;
    }
}

.contact-page-en-title{
    font-size:17px;
    font-weight: 500;
    color:#fff;
    margin: 100px 0 -5px;
}
@media screen and (max-width: 640px) {
    .contact-page-en-title{
    font-size:15px;
    margin: 0px 0 -5px;
    }
}

.contact-page-wrpper{
    max-width: 980px;
    padding: 150px 30px 0px;
    margin: 0 auto;
}
@media screen and (max-width: 1000px) {
    .demo-page-wrpper{
    padding: 100px 30px 50px;
    }
}
}

.other-page-title{
    font-size:40px;
    font-weight: 700;
    color:#ffffff;
    margin:0px 0 15px;
}
@media screen and (max-width: 960px) {
    .other-page-title{
    margin:0px 0 10px;
    }
}
@media screen and (max-width: 640px) {
    .other-page-title{
    font-size:32px;
    margin:10px 0 15px;
    line-height: 42px;
    }
}

.other-page-description-title{
    font-size:18px;
    color:#ffffff;
    font-weight: 300;
    line-height: 30px;
}
@media screen and (max-width: 960px) {
    .other-page-description-title{
     font-size:19px;
     line-height: 28px;
     text-align: center;
     margin-bottom: 30px;
    }
}
@media screen and (max-width: 640px) {
    .other-page-description-title{
    font-size:16px;
    line-height: 23px;
    }
}

.other-page-header-img{
    padding:50px 70px 0;
}
@media screen and (max-width: 640px) {
    .other-page-header-img{
    padding:0 30px 0;
    width: 65%;
    }
}


.other-page-header-img-responsive{
    padding:0 70px 0;
}
@media screen and (max-width: 960px) {
    .other-page-header-img-responsive{
        display: none;
    }
}

.other-page-header-img-responsive-sp{
    display: none;
}
@media screen and (max-width: 960px) {
    .other-page-header-img-responsive-sp{
        display: block;
        margin: 0 auto 50px;
        width: 60%;
    }
}

.other-page-contents{
    background-color: #fff;
    padding: 0px 30px 50px;
}
@media screen and (max-width: 960px) {
    .other-page-contents{
        margin-top: 50px;
    }
}
@media screen and (max-width: 640px) {
    .other-page-contents{
        padding-bottom: 100px;
    }
}

.other-page-contents-wrapper{
    margin-top: 150px;
}
@media screen and (max-width: 640px) {
    .other-page-contents-wrapper{
        margin-top: 0px;
    }
}


.contact-page-contents-wrapper{
    margin-top: 70px;
}
@media screen and (max-width: 640px) {
    .contact-page-contents-wrapper{
        margin-top: 0px;
    }
}

.other-page-submit-done-wrapper{
    margin-top: 250px;
}
@media screen and (max-width: 640px) {
    .other-page-submit-done-wrapper{
        margin-top: 180px;
    }
}



/* デモページ */

.demo-page-wrpper{
    max-width: 980px;
    padding: 150px 30px 50px;
    margin: 0 auto;
}
@media screen and (max-width: 1000px) {
    .demo-page-wrpper{
    padding: 100px 30px 50px;
    }
}

.demo-page-title-box, .faq-page-title-box{
    text-align: center;
}

.demo-page-title-en, .faq-page-title-en{
    font-size:1.8rem;
    font-weight: 600;
    color: #3cd2c8;
}
@media screen and (max-width: 1000px) {
    .demo-page-title-en, .faq-page-title-en{
    font-size:1.8rem;
    }
}

.demo-sub-title-border, .faq-sub-title-border{
    border-bottom:2px solid #3cd2c8;
    padding: 0 0 5px;
}

.demo-page-title, .faq-page-title, .past-event-title-jp{
    font-size: 3.5rem;
    font-weight: 600;
    color: #3e3e3e;
    margin-top: 15px;
}
@media screen and (max-width: 768px) {
    .demo-page-title, .faq-page-title, .past-event-title-jp{
    font-size:2.9rem;
    line-height: 45px;
    margin: 15px 0 10px;
    }
}

.demo-page-title-text{
    font-size:16px;
    color:#3e3e3e;
    margin-top:5px;
}

.demo-web-title-banner{
    text-align: left;
}
@media screen and (max-width: 768px) {
    .demo-web-title-banner{
        text-align: center;
    }
}

.demo-web-title{
    width: 230px;
}




.demo-container{
    margin-top: 150px;
}
@media screen and (max-width: 640px) {
    .demo-container{
        margin-top: 70px;
    }
}

.demo-text-title{
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    letter-spacing: 3px;
    color:#3e3e3e;
}
@media screen and (max-width: 767px) {
    .demo-text-title{
        font-size: 25px;
        line-height: 34px;
    }
}

.demo-title-line{
    text-align: center;
    margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
    .demo-title-line{
        margin-bottom: 40px;
    }
}
@media screen and (max-width: 640px) {
    .demo-title-line{
        margin-bottom: 30px;
    }
}

.demo-text-box{
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 767px) {
    .demo-text-box{
        flex-direction: column;
        margin: 0 auto;
    }
}

.demo-text{
    font-size:16px;
    line-height:25px;
    margin: 0 80px 0 0;
}
@media screen and (max-width: 960px) {
    .demo-text{
        margin: 0 20px 30px 0;
    }
}
@media screen and (max-width: 767px) {
    .demo-text{
        margin: 0 0px 30px 0;
    }
}
@media screen and (max-width: 640px) {
    .demo-text{
        font-size:14px;
        line-height: 23px;
        margin: 0 0px 20px 0;
    }
}


@media screen and (max-width: 640px) {
    .demo-img-box{
        text-align: center;
    }
}


.demo-code-img{
    filter: drop-shadow(7px 7px 7px rgba(0, 0, 0, 0.2));
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}
@media screen and (max-width: 767px) {
    .demo-code-img{
        width: 70%;
    }
}
.demo-stamp-box{
    display: flex;
    justify-content: space-between;
    padding-bottom: 50px;
    border-bottom: 1px solid;
}
@media screen and (max-width: 960px) {
    .demo-stamp-box{
        flex-direction: column;
        margin: 0 auto;
    }
}
@media screen and (max-width: 640px) {
    .demo-stamp-box{
        padding-bottom: 30px;
    }
}

.demo-flow-box{
    width: 200px;
}
@media screen and (max-width: 960px) {
    .demo-flow-box{
        margin: 0 auto;
        width: 70%;
    }
}
@media screen and (max-width: 767px) {
    .demo-flow-box{
        margin: 0 auto;
        width: 60%;
    }
}
@media screen and (max-width: 646px) {
    .demo-flow-box{
        margin: 0 auto;
        width: 90%;
    }
}

.demo-flow-img-box{
    text-align: center;
}

.demo-flow-img{
    border:5px solid rgb(238, 238, 238);
    margin-bottom: 15px;
    filter: drop-shadow(7px 7px 7px rgba(0, 0, 0, 0.2));
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}
@media screen and (max-width: 960px) {
    .demo-flow-img{
        width: 70%;
        border:7px solid rgb(238, 238, 238);
    }
}

.demo-flow-img-d{
    margin-bottom: 15px;
}
@media screen and (max-width: 960px) {
    .demo-flow-img-d{
        display: none;
    }
}

.demo-flow-img-d-sp{
    display: none;
}
@media screen and (max-width: 960px) {
    .demo-flow-img-d-sp{
        display: block;
        margin: 0 auto;
        width: 70%;
    }
}

.demo-flow-text{
    font-size:14px;
}
@media screen and (max-width: 960px) {
    .demo-flow-text{
        font-size:20px;
    }
}
@media screen and (max-width: 640px) {
    .demo-flow-text{
        font-size:16px;
    }
}

.demo-next{
    margin: 0 10px;
    line-height: 20;
}

@media screen and (max-width: 960px) {
    .demo-next-pc{
        display: none;
    }
}

.demo-next-sp{
    display: none;
}
@media screen and (max-width: 960px) {
    .demo-next-sp{
        display: block;
        margin: 20px auto;
    }
}

.demo-other-stamp-container{
    margin-top: 50px;
    display: flex;
}
@media screen and (max-width: 880px) {
    .demo-other-stamp-container{
        flex-direction: column;
        margin:30px auto;

    }
}

.demo-other-stamp-text{
    font-size:16px;
}
@media screen and (max-width: 880px) {
    .demo-other-stamp-text{
        font-size:16px;
        margin-bottom: 20px;
    }
}
@media screen and (max-width: 640px) {
    .demo-other-stamp-text{
        display: none;
    }
}

.demo-other-stamp-text-sp{
    display: none;
}
@media screen and (max-width: 640px) {
    .demo-other-stamp-text-sp{
        display: block;
        font-size:14px;
        margin-bottom: 20px;

    }
}

.demo-other-qr-wrapper{
    display: flex;
}
@media screen and (max-width: 880px) {
    .demo-other-qr-wrapper{
        margin:0 auto;
    }
}

.demo-other-qr-box{
    width:70%;
    margin:0 25px;
    text-align: center;
}
@media screen and (max-width: 960px) {
    .demo-other-qr-box{
        margin-left:30px;
    }
}
@media screen and (max-width: 880px) {
    .demo-other-qr-box{
        margin:0 30px;
    }
}
@media screen and (max-width: 640px) {
    .demo-other-qr-box{
        margin:0 10px;
        text-align: center;
    }
}


@media screen and (max-width: 960px) {
    .demo-gift-text-box{
        margin-bottom: 60px;
    }
}
@media screen and (max-width: 640px) {
    .demo-gift-text-box{
        margin-bottom: 50px;
    }
}

.demo-gift-text-title{
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    margin-bottom: 5px;
    color:#3e3e3e;
    letter-spacing: 3px;
}
@media screen and (max-width: 767px) {
    .demo-gift-text-title{
        font-size: 25px;
        margin-bottom: 2px;
    }
}

.demo-gift-text{
    text-align: center;
    font-size:18px;
    line-height:30px;
    margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
    .demo-gift-text{
        margin-bottom: 0px;
    }
}
@media screen and (max-width: 640px) {
    .demo-gift-text{
        margin-bottom: 0px;
        line-height:25px;
    }
}

.demo-gift-box{
    display: flex;
    justify-content: space-around;
    padding-bottom: 50px;
}
@media screen and (max-width: 960px) {
    .demo-gift-box{
        flex-direction: column;
        margin: 0 auto;
    }
}
@media screen and (max-width: 640px) {
    .demo-gift-box{
        padding-bottom: 30px;
    }
}

.demo-gift-dececription-title{
    font-size:20px;
    font-weight: 600;
    text-align: center;
    margin:7px 0 7px;
    line-height: 22px;
}
@media screen and (max-width: 960px) {
    .demo-gift-dececription-title{
        font-size:30px;
        margin:10px;
        line-height: 28px;
    }
}
@media screen and (max-width: 768px) {
    .demo-gift-dececription-title{
        font-size:26px;
        margin:8px;
        line-height: 26px;
    }
}
@media screen and (max-width: 640px) {
    .demo-gift-dececription-title{
        font-size:22px;
        margin:8px;
        line-height: 24px;
    }
}

.demo-gift-dececription-title-sub{
    font-size: 14px;
    font-weight: 600;
}
@media screen and (max-width: 960px) {
    .demo-gift-dececription-title-sub{
        font-size:18px;
    }
}
@media screen and (max-width: 767px) {
    .demo-gift-dececription-title-sub{
        font-size:16px;
    }
}
@media screen and (max-width: 640px) {
    .demo-gift-dececription-title-sub{
        font-size:14px;
    }
}

.demo-gift-dececription{
    font-size:14px;
}
@media screen and (max-width: 960px) {
    .demo-gift-dececription{
        font-size:16px;
        text-align: center;
    }
}


/* よくある質問 */

.faq-page-wrpper{
    max-width: 980px;
    padding: 150px 30px 30px;
    margin: 0 auto;
}
@media screen and (max-width: 768px) {
    .faq-page-wrpper{
        padding: 100px 30px 50px;
    }
}

.faq-page-jump-link-set{
    display: flex;
    justify-content: space-around;
    margin-top:30px;
    padding:0 30px
}
@media screen and (max-width: 1000px) {
    .faq-page-jump-link-set{
        flex-direction: column;
    }
}


.faq-contents, .faq-contents-app, .faq-contents-web, .faq-contents-user{
    display: block;
    font-size:14px;
    font-weight: 500;
    margin-bottom: 3px;
    border:1px solid #3e3e3e;
    border-radius: 100vh;
    padding:10px 20px;
}
@media screen and (max-width: 768px) {
    a.faq-contents, .faq-contents-app, .faq-contents-web, .faq-contents-user{
        color:#3e3e3e;
        margin-bottom: 10px;
        text-align: center;
    }
}

a.faq-contents:hover{
    color:#fff;
    background-color: #3cd2c8;
    border:1px solid #3cd2c8;
}
@media screen and (max-width: 768px) {
    a.faq-contents:hover{
        color:#3cd2c8;
    }
}

a.faq-contents-app:hover{
    color:#fff;
    background-color: #52a5dc;
    border:1px solid #52a5dc;
}
@media screen and (max-width: 768px) {
    a.faq-contents-app:hover{
        color:#52a5dc;
    }
}

a.faq-contents-web:hover{
    color:#fff;
    background-color: #ed7980;
    border:1px solid #ed7980;
}
@media screen and (max-width: 768px) {
    a.faq-contents-web:hover{
        color:#ed7980;
    }
}

a.faq-contents-user:hover{
    color:#fff;
    background-color: #3e3e3e;
    border:1px solid #3e3e3e;
}
@media screen and (max-width: 768px) {
    a.faq-contents-user:hover{
        color:#3e3e3e;
    }
}


.faq-appxwab-container{
    background-color: #ecfcfc;
    padding: 60px 30px 130px;
}
@media screen and (max-width: 768px) {
    .faq-appxwab-container{
        padding: 50px 30px 50px;
    }
}

.faq-title-img{
    width: 300px;
    margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
    .faq-title-img{
        width: 200px;
    }
}

.faq-appxweb-title{
    font-size: 30px;
    font-weight: 600;
    color:#3e3e3e;
}
@media screen and (max-width: 768px) {
    .faq-appxweb-title{
        font-size: 25px;
    }
}

.faq_table_headline_set{
    background-color: #52a5dc;
}


.faq_table_headline_left{
    background-color:#595757 ;
    border: 1px solid #fff;
    font-size:1.6rem;
    font-weight: 500;
    padding: 8px 0 8px;
}

.faq_table_headline_center{
    background-color: #52a5dc;
    border: 1px solid #fff;
    font-size:1.6rem;
    font-weight: 500;
    padding: 8px 0 8px;
}

.faq_table_headline_right{
    background-color: #ed7980;
    border: 1px solid #fff;
    font-size:1.6rem;
    font-weight: 500;
    padding: 8px 0 8px;
}


.faq-app-or-web-container{
    margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
    .faq-app-or-web-container{
        margin: 80px 0 0;
    }
}

.faq-app-or-web-title{
    text-align: center;
}

.qa-title{
    width: 110px;
    margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
    .qa-title{
        width: 80px;
    }
}

.faq-app-or-web-contents{
    width: 415px;
    background-color: #fff;
    padding:30px;
    border-radius: 20px;
}
@media screen and (max-width: 768px) {
    .faq-app-or-web-contents{
        width: 100%;
        margin-bottom: 30px;
    }
}

.faq-app-or-web-contents-box{
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
    .faq-app-or-web-contents-box{
        flex-wrap: wrap;
        margin-bottom: 0px;
    }
}

.faq-app-or-web-contents-question-box{
    display: flex;
    border-bottom:1px solid #a4a4a4;
    padding-bottom:20px;
    margin-bottom: 20px;
}

.question-img, .answer-img{
    height: 26px;
}
@media screen and (max-width: 768px) {
    .question-img, .answer-img{
        height: 20px;
    }
}

.faq-app-or-web-contents-question-text{
    font-size:16px;
    font-weight:600;
    margin:0 0 0 15px;
    color:#3e3e3e;
}

.faq-app-or-web-contents-answer-box{
    display: flex;
}

.faq-app-or-web-contents-answer-text-tag{
    margin:0 0 0px 15px;
}

.faq-web-tag{
    width: 70px;
    margin-bottom: 10px;
}

.faq-app-or-web-contents-answer-text{
    font-size: 13px;
    color:#3e3e3e;
}

.faq-patern-title{
    margin: 130px 0 30px 0;
    text-align: center;
}
@media screen and (max-width: 768px) {
    .faq-patern-title{
        margin: 20px 0 10px 0;
    }
}

.faq-patern-wrapper{
    display: flex;
    justify-content: space-around;
}
@media screen and (max-width: 768px) {
    .faq-patern-wrapper{
        text-align: center;
    }
}

.patern-title-img{
    width: 650px;
}
@media screen and (max-width: 768px) {
    .patern-title-img{
        width: 90%;
    }
}

.patern-app-banner{
    width: 80%;
}
@media screen and (max-width: 640px) {
    .patern-app-banner{
        width: 85%;
        margin:0 10px;
    }
}


.faq-q-a-container{
    background-color: #fff;
    padding-top: 150px;
}
@media screen and (max-width: 640px) {
    .faq-q-a-container{
        padding-top: 50px;
    }
}

.faq-q-a-main {
    max-width: 980px;
    margin: 0px auto;
}
@media screen and (max-width: 768px) {
    .faq-q-a-main{
        padding: 0 30px;
    }
}




/* ↓ここから過去のfaqタグ */
.faq-section-title-box{
    display: flex;
    align-items: center;
    border-bottom: solid 1px #3e3e3e;
    padding:0 0 20px;
}
@media screen and (max-width: 640px) {
    .faq-section-title-box{
        padding:10px 0 5px;
    }
}

.faq-section-title{
    font-size:26px;
    font-weight: 600;
    padding-top:10px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .faq-section-title{
        font-size:19px;
        padding-top:5px;
    }
}

.faq-wrapper-a{
    margin-bottom: 150px;
}
@media screen and (max-width: 640px) {
    .faq-wrapper-a{
        margin-bottom: 70px;
    }
}

@media screen and (max-width: 640px) {
    .faq-wrapper-b{
        margin-bottom: 50px;
    }
}

.faq-container{
    border-bottom: solid 1px;
    padding: 20px 0 35px;
}
@media screen and (max-width: 640px) {
    .faq-container{
        padding: 10px 0 25px;
    }
}

summary {
    display: block;
    cursor: pointer;
    font-size:18px;
    font-weight: 600;
    margin-top: 20px;
    transition:all 0.2s;
    text-indent: -36px;
    padding-left: 36px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    summary{
        font-size:16px;
        text-indent: -25px;
        padding-left: 25px;
    }
}

summary::-webkit-details-marker {
    display: none;
    color: transparent;
  }

summary:before{
    content:'Q';
    margin-right: 20px;
    color:#3cd2c8;
    font-size:23px;
}
@media screen and (max-width: 640px) {
    summary:before{
        font-size:20px;
        margin-right: 10px;
    }
}

summary:hover{
    color:#3cd2c8;
}

details {
    margin: 0px 0;
    height:100%;
    transition: .5s;
}

details[open] {
    height: 100%;
  }

.faq-text-container{
    margin-top: 20px;
    padding: 0 30px 0 60px ;
}
@media screen and (max-width: 640px) {
    .faq-text-container{
        padding:0 0 0 23px ;
    }
}

.faq-text{
    font-size:16px;
    color:#3e3e3e;
    line-height: 26px;
}
@media screen and (max-width: 640px) {
    .faq-text{
        font-size:14px;
    }
}

.faq-text_b{
    font-size:17px;
    margin-top: 10px;
    color:#3e3e3e;
    line-height: 26px;
}
@media screen and (max-width: 640px) {
    .faq-text_b{
        font-size:14px;
    }
}

/* .faq-text:before{
    content:'A.';
    margin-right: 5px;
    font-size:17px;
}
@media screen and (max-width: 640px) {
    .faq-text:before{
        font-size:16px;
    }
} */

.faq-ol-style{
    list-style: none;
    padding-left: 20px;
    text-indent: -1.3em;
    font-size:17px;
}

.faq-ul-style{
    text-indent: 0em;
    list-style-type: none;
}

.faq-li-style-b{
    text-indent: -20px;
}

.faq-li-style-b:before{
    content:'└ ';
}





/* フォーム */
  form{
    margin:0 auto;
  }
  .item{
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 40px 0;
    border-bottom: solid 1px rgb(185, 185, 185);
  }
@media screen and (max-width: 960px){
.item {
    flex-direction: column;
    align-items: start;
}
}    

  .item-b{
    display: flex;
    overflow: hidden;
    padding: 40px 0;
    border-bottom: solid 1px rgb(185, 185, 185);
  }
  @media screen and (max-width: 960px){
    .item-b {
        flex-direction: column;
        align-items: start;
    }
    }  
  .label, .information-use-title{
    font-size:16px;
    font-weight: 600;
    margin-right: 40px;
    width:240px;
    color:#3e3e3e;
  }
  @media screen and (max-width: 960px){
    .label, .information-use-title {
        margin-bottom: 5px;
        width:100%;
    }
} 
@media screen and (max-width: 640px){
    .label, .information-use-title {
        font-size:14px;
    }
}  

.details-box{
    width:240px;
    margin-right: 40px;
}
@media screen and (max-width: 960px){
    .details-box{
        margin-bottom: 5px;
        width:100%;
    }
} 

  .mandatory{
      font-size:17px;
      font-weight: normal;
      color:#ff0000;
      letter-spacing:2px;
  }
  .inputs{
    float: left;
    width:680px;
  }
  @media screen and (max-width: 960px){
    .inputs {
        width:100%;
    }
}   
  input[type="text"],input[type="email"],input[type="tel"]{
    background-color: #f5f5f5;
    border:solid 0px; 
    padding:15px;
    font-size: 15px;
    -webkit-appearance: none;
    border-radius: 0;
  }
  @media screen and (max-width: 960px){
    input[type="text"],input[type="email"],input[type="tel"]{
        width:100%;
    }
}  

  textarea{
    background-color: #f5f5f5;
    border:solid 0px; 
    padding:15px;
    height: 300px;
    font-size: 15px;
  }
  .btn-area{
    text-align: center;
  }
  .submit-btn{
    background: #3cd2c8;
    border: none;
    color: white;
    letter-spacing: 4px;
    font-size:16px;
    padding: 25px 100px;
    margin-top: 30px;
    -webkit-appearance: none;
    border-radius: 0;
    cursor:pointer;
  }
  @media screen and (max-width: 960px){
    .submit-btn {
        width: 100%;
        padding:20px 0;
        margin-top: 20px;
    }
}  

  .information-use{
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 40px 0;
  }
  @media screen and (max-width: 960px){
    .information-use {
        flex-direction: column;
        align-items: start;
    }
}  

  .information-use-text{
      width: 700px;
      font-size:15px;
  }
  @media screen and (max-width: 960px){
    .information-use-text {
        width:100%;
    }
} 

  .form-privacy{
      color:#3e3e3e;
      text-decoration:underline;
  }

  .form-privacy:hover{
    color:#3cd2c8;
}

.cp_ipselect {
	overflow: hidden;
	width: 370px;
	text-align: center;
}
@media screen and (max-width: 960px){
    .cp_ipselect {
        width:100%;
    }
}   
.cp_ipselect select {
	width: 100%;
    font-size:15px;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl01 {
	position: relative;
	border-radius: 2px;
	background: #f5f5f5;
}
.cp_ipselect.cp_sl01::before {
	position: absolute;
	top: 2em;
	right: 0.9em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #3e3e3e;
	pointer-events: none;
}
.cp_ipselect.cp_sl01 select {
	padding: 15px;
	color: #3e3e3e;
}

/* フォームテキストスタイル */
.form-text{
    font-size:18px;
    width: 700px;
}
@media screen and (max-width: 640px){
    .form-text{
        font-size:16px;
        width:100%;
        -webkit-text-size-adjust: 100%;
    }
}   


  /* フォームエラー */
  .inputs-error{
    float: left;
    width:680px;
  }
  @media screen and (max-width: 960px){
    .inputs-error {
        width:100%;
    }
}   
  .inputs-error[type="text"],.inputs-error[type="email"]{
    background-color: #ffdddd;
    border:solid 0px; 
    padding:15px;
    font-size: 15px;
  }
  .inputs-error-textarea{
    background-color: #ffdddd;
  }

.error{
    border:1px solid #ff0000;
    margin:50px 0 40px;
}
@media screen and (max-width: 960px){
    .error{
        margin: 170px 0 20px;
    }
}
@media screen and (max-width: 640px){
    .error{
        margin: 120px 0 10px;
        text-align: center;
    }
}  
.error-msg{
    font-size:18px;
    font-weight: 600;
    color:#ff0000;
    padding: 20px;
}

  /* フォーム確認ページ送信ボタン */
.confirm-msg{
    font-size:24px;
    font-weight: 600;
    color:#3e3e3e;
    margin-bottom: 50px;
    text-align: center;
}
@media screen and (max-width: 960px){
    .confirm-msg{
        font-size:20px;
        margin: 170px 0 20px;
    }
}
@media screen and (max-width: 640px){
    .confirm-msg{
        margin: 120px 0 10px;
    }
}  
.form-btn{
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}
@media screen and (max-width: 960px){
    .form-btn {
        flex-direction: column-reverse;
        margin-top: 10px;
    }
}  

  .back-btn{
    background: #dddddd;
    border: none;
    text-align: center;
    color: rgb(0, 0, 0);
    letter-spacing: 4px;
    font-size:16px;
    padding: 25px 50px;
    margin-right: 25px;
    -webkit-appearance: none;
    border-radius: 0;
    cursor:pointer;
  }
  @media screen and (max-width: 960px){
    .back-btn{
        width: 100%;
        padding:20px 0;
    }
}  
@media screen and (max-width: 640px){
    .back-btn {
        font-size:14px;
    }
}  

  .submit-confirm{
    background: #3cd2c8;
    border: none;
    text-align: center;
    color: white;
    letter-spacing: 3px;
    font-size:16px;
    padding: 25px 170px;
    -webkit-appearance: none;
    border-radius: 0;
    cursor:pointer;
  }
  @media screen and (max-width: 960px){
    .submit-confirm {
        width: 100%;
        padding:20px 0;
        margin-bottom: 20px;
    }
}  
@media screen and (max-width: 640px){
    .submit-confirm {
        font-size:14px;
    }
}  


/* フォーム送信完了 */
.done-container{
    text-align: center;
}
@media screen and (max-width: 640px){
    .done-container{
        margin-top: 50px;
    }
}  

.done-title{
    position: relative;
    display: inline-block;
    font-size:36px;
    font-weight: 800;
    color:#3cd2c8;
    margin-bottom: 60px;
}
@media screen and (max-width: 640px){
    .done-title{
        font-size:25px;
    }
}  

.done-title::before{
    content: '';
    position: absolute;
    left: 50%;
    bottom: -30px; /*下線の上下位置調整*/
    display: inline-block;
    width: 100px; /*下線の幅*/
    height: 2px; /*下線の太さ*/
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50%); /*位置調整*/
    background-color: #3cd2c8; /*下線の色*/
}

.done-text{
    font-size: 16px;
}
@media screen and (max-width: 640px){
    .done-text{
        font-size:14px;
    }
}  


/* フローティングバナー */

.floating-banner {
    position: fixed; /* 追従 */
    z-index: 99999; /* 他の要素の下に隠れないように */
    bottom: 0px; /* バナーの上下の位置 */
    left: 20px; /* バナーの左右の位置 */
    filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.3));
}
.pc {
    width: 250px; /* バナーの横幅を指定 */
}
.floating-banner:hover {
    opacity: .8; /* ホバーで少し透過 */
}
.sp {
    display: none; /* PCではスマホ用のバナーは非表示に */
}
@media screen and (max-width: 990px) { /* タブレット用のブレイクポイントを指定 */
    .pc {
        display: none; /* タブレットサイズ以下でPC用のバナーを非表示に */
    }
}

@media screen and (max-width: 560px) { /* スマホ用のブレイクポイントを指定 */
    .sp {
        display: inline-block; /* 消していたスマホ用のバナーを表示させる */
        width: 100vw; /* スマホの画面幅いっぱいにバナーを表示 */
    }
    .floating-banner  {
        top: unset; /* PCで指定していた上下の位置指定をクリア */
        left: 0px; /* 左右の隙間が空かないように */
        bottom: 0; /* 画面の最下部にぴったりくっつくように指定 */
    }
}


/* フッター */

.footer{
    background-color: #000;
    padding: 100px 30px 10px;
}
@media screen and (max-width: 640px) {
    .footer{
        padding: 50px 0 0;
    }
}

.footer-contents{
    max-width: 980px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 640px) {
    .footer-contents{
        flex-direction: column-reverse;
        margin-bottom: 0px;
    }
}

.footer-left{
    text-align: left;
}
@media screen and (max-width: 640px) {
    .footer-left{
        margin: 0 auto;
        text-align: center;
    }
}

.footer-logo{
    margin: 0 0 25px;
}
@media screen and (max-width: 640px) {
    .footer-logo{
        width: 60%;
    }
}

.footer_g-mark_annotation{
    font-size: 10px;
    color:#fff;
    margin: 5px 0 0;
}

.tel-img{
    margin: 30px 0 0px;
}

.url-text{
    display: block;
    font-size:14px;
    font-weight: 500;
    color:#fff;
}

.isms_logo{
    width: 80px;
    margin-right: 10px;
}

.footer_office_set{
    display: flex;
    align-items: center;
    border-top:1px solid #fff;
    margin-top:35px;
}
@media screen and (max-width: 768px) {
    .footer_office_set{
    flex-direction: column-reverse;
    margin-top: 20px;
    }
}

.footer_office_info{
    margin:15px 0;
}
@media screen and (max-width: 768px) {
    .footer_office_info{
        margin:0px 0 15px;
    }
}

.office_name{
    font-size:12px;
    color:#fff;
}

.dl-btn{
    display: flex;
    margin-top: 25px;
}
@media screen and (max-width: 640px) {
    .dl-btn{
    display: block;
    margin: 20 auto 0;
    text-align: center;
    }
}

.app{
    margin-right: 10px;
}
@media screen and (max-width: 640px) {
    .app{
        margin:0 0 10px;
    }
}

.dl-annotation-box{
    margin-top: 12px;
    padding-left: 12px;
}

.dl-annotation-text{
    font-size: 8px;
    color:#fff;
}

.footer-right{
    text-align: right;
}
@media screen and (max-width: 640px) {
    .footer-right{
        text-align: center;
        margin: 0 auto 30px;
    }
}

.footer-link{
    font-size: 14px;
    margin-bottom: 5px;
    color:#fff;
}

.footer-text{
    color:#fff;
}

a[href*="tel:05017423435"]{
    pointer-events: none;
}
@media only screen and (max-width: 640px) {
	a[href*="tel:05017423435"] {
		pointer-events: initial;
	}
}

a.footer_menu_btn_b {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	padding: 1rem 4rem 0.8rem;
    margin-bottom: 20px;
    font-size: 13px;
	font-weight: 600;
	border: 2px solid #f3a245;
	background: #f3a245;
	color: #fff;
	border-radius: 100vh;
	transition: 0.5s;
    letter-spacing: 1px;
}
@media screen and (max-width: 768px) {
    a.footer_menu_btn_b {
        margin: 20px;
    }
}
a.footer_menu_btn_b:hover {
	color: #f3a245;
	background: #fff;
}

.copyright{
    font-size: 12px;
    text-align: center;
    color:#fff;
    margin-top: 50px;
    padding-bottom: 20px;
}

/* サポートフォーム */
.form-left-top{
    align-items: flex-start;
}
.form-left-contents{
  display:block;
  margin-right: 40px;
  width:240px;
  font-size: 16px;
  font-weight: 600;
}
@media screen and (max-width: 960px) {
  .form-left-contents{
    width:100%;
  }
}
.form-desire-date-wrpper{
  width:calc(100% - 280px);
}
@media screen and (max-width: 960px) {
  .form-desire-date-wrpper{
    width:100%;
  }
}
.form-desire-date{
  margin-top:20px;
  width:auto;
  font-size: 16px;
}
.form-desire-date:first-child{
  margin-top:0px;
}
@media screen and (max-width: 960px) {
  .form-desire-date span{
    display:block;
  }
}
.form-desire-date .inputs{
  float:none;
  width:calc(100% - 70px);
}
@media screen and (max-width: 960px) {
  .form-desire-date .inputs{
    width:100%;
  }
}
.web-support-reserve-confirm .confirm-msg{
  padding-top:50px;
}

/* /サポートフォーム */


/* furari APP page */

.furari-app-header-body{
    position: relative;
    padding: 100px 30px 0px;
    /* オーバーレイの高さを指定 */
    height: 60vh;  
    /* オーバーレイの色と画像の指定 */
    background: linear-gradient(rgba(255, 255, 255, 0.7),  rgba(255, 255, 255, 0.7)),  url(../furari_images/app-page-main-img.jpg); 
    /* 画像の位置やサイズの調整 */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}
@media screen and (max-width: 1000px) {
    .furari-app-header-body{
        padding: 90px 0px 0px;
        background-size: cover;
        height: 70vh; 
    }
}
@media screen and (max-width: 768px) {
    .furari-app-header-body{
        background-size: cover;
        height: 72vh; 
    }
}


.app-join-container{
    padding: 80px 30px;
    background-color: #eaf3fe;
}
@media screen and (max-width: 960px) {
    .app-join-container{
        padding: 50px 30px 50px;
    }
}

.app-contents-title-box{
    text-align: center;
    margin: 0 0 60px;
}
@media screen and (max-width: 960px) {
    .app-contents-title-box{
    margin: 0 0 0px;
    }
}

.app-join-set{
    display: flex;
    align-items: center;
    width: 280px;
}
@media screen and (max-width: 960px) {
    .app-join-set{
    flex-direction: column;
    width: 100%;
    }
}

.app_join-img{
    width: 100px;
}

.app-join-text{
    font-size:14px;
    font-weight: 500;
    color:#3e3e3e;
    margin-left: 10px;
}
@media screen and (max-width: 960px) {
    .app-join-text{
    font-size:14px;
    margin:10px 0 0;
    text-align: center;
    }
}

.app-dl-set{
    text-align: center;
}

.app-dl-img{
    margin-top: 5px;
}

.app_arrow{
    width: 15px;
}

.app-join-noinfo{
    font-size:18px;
    font-weight: 500;
    color:#fff;
    background-color: #52a5dc;
    text-align: center;
    margin:20px 0 0;
    padding:5px;
    border-radius: 50px;
}
@media screen and (max-width: 960px) {
    .app-join-noinfo{
    font-size:18px;
    border-radius: 10px;
    }
}

.app-contents-title-en{
    font-size:1.8rem;
    font-weight: 600;
    color: #52a5dc;
}
@media screen and (max-width: 1000px) {
    .app-contents-title-en{
    font-size:1.6rem;
    }
}

.app-sub-title-border{
    border-bottom:2px solid #52a5dc;
    padding: 0 0 5px;
}

.app-feature-box-left-title{
    font-size:22px;
    font-weight:600;
    color:#fff;
    background-color: #52a5dc;
    text-align: center;
    padding:20px;
    border-radius: 10px;
}
@media screen and (max-width: 960px) {
    .app-feature-box-left-title{
    font-size: 20px;
    padding:10px;
    }
}

.app-contents-title-en{
    font-size:1.8rem;
    font-weight: 600;
    color: #52a5dc;
}
@media screen and (max-width: 1000px) {
    .app-contents-title-en{
    font-size:1.6rem;
    }
}



/* furari WEB page */

.furari-web-header-body{
    position: relative;
    padding: 100px 30px 0px;
    /* オーバーレイの高さを指定 */
    height: 60vh;  
    /* オーバーレイの色と画像の指定 */
    background: linear-gradient(rgba(255, 255, 255, 0.7),  rgba(255, 255, 255, 0.7)),  url(../furari_images/web-page-main-img.jpg); 
    /* 画像の位置やサイズの調整 */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}
@media screen and (max-width: 1000px) {
    .furari-web-header-body{
        padding: 90px 0px 0px;
        background-size: cover;
        height: 70vh; 
    }
}
@media screen and (max-width: 768px) {
    .furari-web-header-body{
        background-size: cover;
        height: 72vh; 
    }
}

.furari-web-header-main {
    max-width: 980px;
    margin: 0px auto;
}


.furari-web-header-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding:90px 0px 0px 0px;
}
@media screen and (max-width: 1000px) {
    .furari-web-header-title {
        flex-direction: column-reverse;
        text-align: center;
        padding: 50px 0px 50px;
    }
}
@media screen and (max-width: 768px) {
    .furari-web-header-title {
        flex-direction: column-reverse;
        text-align: center;
        padding: 10px 0px 0;
    }
}

.furari-web-header-img{
    position: absolute;
    top: 35%;
    left: 25%;
    width: 300px;
}
@media screen and (max-width: 1000px) {
    .furari-web-header-img{
        position: static;
    }
}

.furari-web-main-title{
    font-size:3.2rem;
    font-weight: 600;
    color:#3e3e3e;
    margin:0px 0 25px;
    line-height: 45px;
}
@media screen and (max-width: 640px) {
    .furari-web-main-title{
    font-size:1.8rem;
    margin:0px 0 20px;
    line-height: 25px;
    }
}

.furar-web-header-title-right{
    margin: 30px 0 0px;
}
@media screen and (max-width: 640px) {
    .furar-web-header-title-right{
    margin: 0 0 40px;
    }
}

.furari-web-title-img{
    width:550px;
}
@media screen and (max-width: 640px) {
    .furari-web-title-img{
    width:100%;
    margin: 0px;
    }
}

.furari-web-sub-title{
    color:#3e3e3e;
    text-align: center;
    font-size: 2.5rem;
    font-weight: 600;
    padding:10px 0;
    margin:0 45px;
    letter-spacing: 1.5px;
    border-top:1px solid #3e3e3e;
    border-bottom: 1px solid #3e3e3e;
    filter: drop-shadow(0 0 0.5rem rgb(255, 255, 255));
}
@media screen and (max-width: 640px) {
    .furari-web-sub-title{
    font-size: 1.9rem;
    padding:10px 0;
    margin:0 35px;
    }
}

.web-container{
    padding: 140px 30px 130px;
    background-color: #fff;
}
@media screen and (max-width: 768px) {
    .web-container{
    padding: 80px 30px 50px;
    }
}

.web-wrapper, .faq-page-wrapper {
    max-width: 980px;
    margin: 0 auto;
}

.web-contents-title-box{
    text-align: center;
    margin-bottom: 40px;
}


.faq-contents-title-box{
    margin: 0 0 30px;
    text-align: center;
}
@media screen and (max-width: 1000px) {
    .faq-contents-title-box{
    margin: 0 0 10px;
    }
}



.app-contents-title-box{
    margin: 0 0 30px;
    text-align: center;
}
@media screen and (max-width: 1000px) {
    .app-contents-title-box{
    margin: 0 0 20px;
    }
}

.web-contents-title-box_price, .app-contents-title-box_price{
    text-align: center;
    margin: 0 0 30px;
}
@media screen and (max-width: 1000px) {
    .web-contents-title-box_price, .app-contents-title-box_price{
    margin: 0 0 20px;
    }
}

.web-contents-title-en{
    font-size:1.8rem;
    font-weight: 600;
    color: #ed7980;
}
@media screen and (max-width: 1000px) {
    .web-contents-title-en{
    font-size:1.6rem;
    }
}

.sub-title-border{
    border-bottom:2px solid #ed7980;
    padding: 0 0 5px;
}

.web-contents-title{
    font-size: 3.3rem;
    font-weight: 600;
    color: #3e3e3e;
    margin-top: 10px;
}
@media screen and (max-width: 768px) {
    .web-contents-title{
    font-size:2.4rem;
    }
}


/* furari WEB page - 参加方法*/

.web-join-container{
    padding: 100px 30px;
    background-color: #fff0f2;
}
@media screen and (max-width: 960px) {
    .web-join-container{
        padding: 180px 30px 50px;
    }
}

.web-join-wrapper, .app-join-wrapper{
    max-width: 980px;
    margin: 0 auto;
}

.web-join-title, .app-join-title{
    font-size:18px;
    font-weight: 600;
    color:#3e3e3e;
    margin-bottom:5px;
}
@media screen and (max-width: 960px) {
    .web-join-title{
        font-size: 16px;
    }
}

.web-join-box, .app-join-box{
    background-color: #fff;
    padding: 20px;
    border-radius: 20px;
}
@media screen and (max-width: 960px) {
    .web-join-box, .app-join-box{
        padding:25px;
    }
}

.web-join-inbox, .app-join-inbox{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 960px) {
    .web-join-inbox, .app-join-inbox{
    flex-direction: column;
    }
}

.web-join-set{
    display: flex;
    align-items: center;
    width: 400px;
}
@media screen and (max-width: 960px) {
    .web-join-set{
    flex-direction: column;
    width: 100%;
    }
}

.join-img{
    width: 150px;
}

.web-join-text{
    font-size:16px;
    font-weight: 500;
    color:#3e3e3e;
    margin-left: 10px;
}
@media screen and (max-width: 960px) {
    .web-join-text{
    font-size:14px;
    margin:10px 0 0;
    }
}

.or{
    display: inline-block;
    width: 60px;
    height: 60px;
    border:solid 1px #3e3e3e;
    border-radius: 50%;
    background: fff;
    font-size: 18px;
    font-weight: 500;
    text-align:center;
    line-height: 60px;
    align-items: center;
}
@media screen and (max-width: 960px) {
    .or{
    margin:10px 0;
    }
}

.web-join-noapp{
    font-size:18px;
    font-weight: 500;
    color:#fff;
    background-color: #ed7980;
    text-align: center;
    margin:20px 0 0;
    padding:5px;
    border-radius: 50px;
}
@media screen and (max-width: 960px) {
    .web-join-noapp{
    font-size:18px;
    border-radius: 10px;
    }
}

.web-join-annotation, .app-join-annotation{
    font-size:12px;
    color: #3e3e3e;
    margin-top: 10px;
}


/* furari WEB page - feature*/


.web-feature-contents{
}

.web-feature-contents-title{
    font-size:2.4rem;
    font-weight: 600;
    color: #ed7980;
    text-align: center;
    line-height: 32px;
}

.web-feature-customize-wrapper{
    display: flex;
    padding-bottom:50px;
    border-bottom:1px solid #a4a4a4;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-wrapper{
    flex-direction: column;
    padding-bottom:30px;
    }
}

.web-feature-customize-box-left{
    width: 420px;
    padding:0 39px 0 0;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-box-left{
    width:100%;
    padding:0px;
    }
}

.web-feature-customize-box-left-title{
    font-size:22px;
    font-weight:600;
    color:#fff;
    background-color: #ed7980;
    text-align: center;
    padding:20px;
    border-radius: 10px;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-box-left-title{
    font-size:20px;
    padding:10px;
    }
}

.web-feature-customize-box-left-subtitle{
    font-size:18px;
    font-weight: 600;
    color:#ed7980;
    margin-top:10px;
}

.web-feature-customize-box-left-text{
    font-size: 16px;
    color:#3e3e3e;
}

.web-feature-customize-box-right{
    width: 530px;
    display: flex;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-box-right{
    flex-direction: column;
    width: 100%;
    }
}

.web-feature-customize-inbox-right-line{
    border-right:1px dotted #3e3e3e;
    padding-right: 30px;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-inbox-right-line{
    border-right:none;
    padding-right: 0px;
    }
}

.web-feature-customize-inbox-right{
    padding-left: 30px;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-inbox-right{
    padding-left: 0px;
    }
}

.web-feature-customize-inbox-title{
    font-size: 14px;
    font-weight: 500;
    color:#3e3e3e;
    text-align: center;
    background-color: fff;
    border:1px solid #ed7980;
    padding:3px;
    margin-bottom:15px;
}
@media screen and (max-width: 960px) {
    .web-feature-customize-inbox-title{
    margin:30px 0 20px;
    }
}


@media screen and (max-width: 960px) {
    .web-feature-customize-inbox-img{
    text-align: center;
    }
}

.custermize-img{
    width: 230px;
}
@media screen and (max-width: 960px) {
    .custermize-img{
    width: 80%;
    }
}

.web-feature-wrapper-line{
    display: flex;
    border-bottom:1px solid #a4a4a4;
    padding: 50px 0;
}
@media screen and (max-width: 960px) {
    .web-feature-wrapper-line{
    flex-direction: column;
    padding: 30px 0;
    }
}

.web-feature-wrapper{
    display: flex;
    padding: 50px 0;
}
@media screen and (max-width: 960px) {
    .web-feature-wrapper{
    flex-direction: column;
    padding: 30px 0;
    }
}

.web-feature-box-left-title-box{
    width: 420px;
    padding:0 39px 0 0;
}
@media screen and (max-width: 960px) {
    .web-feature-box-left-title-box{
    width: 100%;
    padding:0px;
    }
}

.web-feature-box-left-title{
    font-size:22px;
    font-weight:600;
    color:#fff;
    background-color: #ed7980;
    text-align: center;
    padding:20px;
    border-radius: 10px;
}
@media screen and (max-width: 960px) {
    .web-feature-box-left-title{
    font-size: 20px;
    padding:10px;
    }
}

.web-feature-box-right-text{
    width: 530px;
    font-size: 16px;
    line-height: 27px;
    color:#3e3e3e;
}
@media screen and (max-width: 960px) {
    .web-feature-box-right-text{
    width:100%;
    font-size: 14px;
    margin-top:10px;
    }
}

.annotation-feature-box{
    /* color:#ffffff; */
    display: block;
    font-size:13px;
    line-height: 21px;
}
.web-feature-box-left-title .annotation-feature-box{
    color:#ffffff;
}


/* furari WEB page-price */

.web-page-price-body, .app-page-price-body{
    background-color: #fff;
    padding: 50px 30px 80px;
}
@media screen and (max-width: 960px) {
    .web-page-price-body, .app-page-price-body {
        padding: 50px 30px 0px;
    }
}


/* furari WEB page-demo */

.web-demo-container{
    background-color: #fdecee;
    padding: 100px 30px 150px;
}
@media screen and (max-width: 1000px) {
    .web-demo-container{
        padding: 80px 30px 70px;
    }
}

.app-demo-container{
    background-color: #eaf3fe;
    padding: 100px 30px 150px;
}
@media screen and (max-width: 1000px) {
    .app-demo-container{
        padding: 80px 30px 70px;
    }
}


.web-contents-sub-title{
    font-size:1.7rem;
    margin:10px 0 40px;
    font-weight: 500;
}
@media screen and (max-width: 1000px) {
    .web-contents-sub-title{
    font-size:1.5rem;
    margin:10px 0 10px;
    }
}

.web-demo-contents{
    border:3px solid #dedede;
    border-radius: 20px;
    background-color: #fff;
}

.web-demo-contents-title{
    font-size:2.3rem;
    font-weight: 600;
    color: #fff;
    text-align: center;
    background-color: #ed7980;
    padding:15px 0 10px;
    border-radius: 15px 15px 0px 0px;
    letter-spacing: 3px;
}
@media screen and (max-width: 768px) {
    .web-demo-contents-title{
    font-size:1.8rem;
    }
}

.app-demo-contents-title{
    font-size:2.3rem;
    font-weight: 600;
    color: #fff;
    text-align: center;
    background-color: #52a5dc;
    padding:15px 0 10px;
    border-radius: 15px 15px 0px 0px;
    letter-spacing: 3px;
}
@media screen and (max-width: 768px) {
    .app-demo-contents-title{
    font-size:1.8rem;
    }
}

.web-demo-contents-box{
    display: flex;
    padding:30px;
}
@media screen and (max-width: 1000px) {
    .web-demo-contents-box{
    flex-direction: column-reverse;
    }
}

.app-demo-contents-text{
    font-size:1.6rem;
    margin-right: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #a4a4a4;
}
@media screen and (max-width: 1000px) {
    .app-demo-contents-text{
        margin:15px 0 15px;
    }
}

.web-demo-contents-text{
    font-size:1.6rem;
    margin-right: 30px;
    padding-bottom: 20px;
}
@media screen and (max-width: 1000px) {
    .web-demo-contents-text{
        margin:0 0 15px;
    }
}

.web-demo-qr{
    width: 150px;
}

.app-demo-guest{
    width: 230px;
}

@media screen and (max-width: 1000px) {
    .web-demo-join-qr{
        text-align: center;
    }
}

.web-next-arrow{
    text-align: center;
    margin: 15px 0;
}

.web-demo-contents-capture-box{
    display: flex;
    justify-content: space-between;
    margin:40px;
    padding-bottom:40px;
    border-bottom:1px solid #3e3e3e;
}
@media screen and (max-width: 1000px) {
    .web-demo-contents-capture-box{
        flex-direction: column;
        text-align: center;
        margin:40px 20px 30px;
        padding-bottom:30px;
    }
}

.web-demo-contents-gift-capture-box{
    display: flex;
    justify-content: space-around;
    margin:40px;
}
@media screen and (max-width: 1000px) {
    .web-demo-contents-gift-capture-box{
        flex-direction: column;
        text-align: center;
        margin:40px 20px 0px;
    }
}

.web-demo-contents-capture{
    width: 180px;
}
@media screen and (max-width: 1000px) {
    .web-demo-contents-capture{
        width: 100%;
    }
}

.web-capture{
    width: 180px;
    border:2px solid #dedede;
    border-radius: 15px;
    margin:0 0 10px;
}
@media screen and (max-width: 1000px) {
    .web-capture{
        width: 90%;
        margin: 0 auto;
    }
}

.web-demo-flow-text{
    font-size:1.4rem;
    color:#3e3e3e;
    line-height: 20px;
}
@media screen and (max-width: 1000px) {
    .web-demo-flow-text{
        margin: 10px 0 0;
    }
}

.web-stamp-qr{
    width: 180px;
    border:2px solid #fff;
    margin:0 0 10px;
}
@media screen and (max-width: 1000px) {
    .web-stamp-qr{
        display: none;
    }
}

.web-stamp-qr_sp{
    display: none;
}
@media screen and (max-width: 1000px) {
    .web-stamp-qr_sp{
        display: block;
        margin: 0 auto;
        width: 70%;
    }
}

.web-demo-other-qr-wrapper{
    display: flex;
    margin: 40px 40px 35px;
}
@media screen and (max-width: 1000px) {
    .web-demo-other-qr-wrapper{
        flex-direction: column;
        margin: 20px;
    }
}

.web-demo-other-qr-text{
    font-size:1.4rem;
    color:#3e3e3e;
}

.web-demo-gift-title{
    font-size: 1.8rem;
    font-weight: 600;
    text-align: center;
    line-height: 23px;
    margin: 5px 0 5px;
    color:#3e3e3e;
}
@media screen and (max-width: 640px) {
    .web-demo-gift-title{
        font-size: 2.2rem;
    margin: 20px 0 0px;
    }
}

.web-demo-gift-dececription-sub-title{
    font-size: 1.5rem;
    font-weight: 600;
}

.web-demo-flow-text{
    font-size: 1.4rem;
    color:#3e3e3e;
}


.web-faq-container{
    background-color: #fff;
    padding: 70px 30px 0px;
}
@media screen and (max-width: 640px) {
    .web-faq-container{
    padding: 70px 30px 50px;
    }
}

.web-faq-wrapper-a{
    padding-bottom: 150px;
}
@media screen and (max-width: 640px) {
    .web-faq-wrapper-a{
    padding-bottom: 70px;
    }
}

.web-faq-text{
    font-size:17px;
    font-weight: 600;
    margin-top: 20px;
}

.web-demo-contents-gift-capture{
    width: 180px;
}
@media screen and (max-width: 1000px) {
    .web-demo-contents-gift-capture{
        width: 100%;
        margin:0 0 50px;
    }
}

.web-summary {
    display: block;
    cursor: pointer;
    font-size:18px;
    font-weight: 600;
    margin-top: 20px;
    transition:all 0.2s;
    text-indent: -36px;
    padding-left: 36px;
}
@media screen and (max-width: 640px) {
    .web-summary{
        font-size:16px;
        text-indent: -25px;
        padding-left: 25px;
    }
}

.web-summary::-webkit-details-marker {
    display: none;
    color: transparent;
  }

  .web-summary:before{
    content:'Q';
    margin-right: 20px;
    color:#ed7980;
    font-size:23px;
}
@media screen and (max-width: 640px) {
    .web-summary:before{
        font-size:20px;
        margin-right: 10px;
    }
}

.web-summary:hover{
    color:#ed7980;
}




/* CTAボタン */

.cta_btn_container{
    background-color: #3e3e3e;
}

.cta_btn_wrapper{
    max-width: 980px;
    margin: 0px auto;
    padding:80px 0;
}
@media screen and (max-width: 960px) {
    .cta_btn_wrapper{
    padding: 50px 30px;
    }
}

.cta_btn_set{
    display: flex;
    justify-content: space-around;
    margin:20px 0;
}

.click{
    margin: 0 0 15px;
    text-align: center;
}

a.btn_04 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 600px;
	margin: auto;
	padding: 3rem 5rem;
	font-weight: bold;
    font-size: 24px;
	border: 2px solid #fff;
    background: #f3a245;
	color: #fff;
	border-radius: 100vh;
	transition: 0.5s;
}
a.btn_04:hover {
	color: #f3a245;
	background: #fff;
}
@media screen and (max-width: 960px) {
    a.btn_04{
    width: 100%;
    font-size:16px;
    padding: 18px 0 16px;
    }
}


a.dl_btn {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 400px;
	margin: 40px auto;
	padding: 2rem 3rem;
	font-weight: 500;
    font-size: 20px;
	border: 2px solid #3cd2c8;
	background: #fff;
	color: #3cd2c8;
	border-radius: 100vh;
	transition: 0.5s;
}
a.dl_btn:hover {
	color: #fff;
	background: #3cd2c8;
}
@media screen and (max-width: 960px) {
    a.dl_btn{
    width: 100%;
    font-size:16px;
    padding: 18px 0 16px;
    }
}



html {
    scroll-behavior: smooth;
}
.pagetop {
    height: 80px;
    width: 80px;
    position: fixed;
    right: 40px;
    bottom: 30px;
    background: #fff;
    border: solid 2px #3cd2c8;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    filter:drop-shadow(7px 7px 7px rgba(65,65,65, 0.4));
    
}
@media screen and (max-width: 768px) {
    .pagetop{
    height: 50px;
    width: 50px;
    right: 5px;
    bottom: 20px;
    }
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 2px solid #3cd2c8;
    border-right: 2px solid #3cd2c8;
    transform: translateY(20%) rotate(-45deg);
}


.contact-text{
    text-align: center;
    font-size: 26px;
    font-weight: 600;
    line-height: 40px;
    color:#fff;
}
@media screen and (max-width: 640px) {
    .contact-text{
    font-size:24px;
    line-height: 38px;
    }
}

.cta_btn_box{
    display: flex;
    justify-content: space-between;
}
@media screen and (max-width: 640px) {
    .cta_btn_box{
    flex-direction: column;
    }
}

.cta_btn_inbox{
    width: 420px;
    background: #fff;
    padding: 30px;
    margin-top: 30px;
    border-radius: 10px;
}
@media screen and (max-width: 640px) {
    .cta_btn_inbox{
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    }
}

.cta_btn_set_title {
    font-size: 21px;
    font-weight:600;
    text-align: center;
    color:#3e3e3e;
    margin-bottom: 10px;
    align-items: center;
}

.cta_icon_dl{
    margin-right: 7px;
}

.cta_icon_mail{
    margin-right: 7px;
    vertical-align: 4px;
}

.cta_btn_set_text{
    font-size:14px;
    text-align: center;
    color: #3e3e3e;
    line-height: 23px;
}


a.cta_btn_dl {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 400px;
	margin: 20px auto 0;
	padding: 20px 0;
	font-weight: 600;
    font-size: 16px;
	border: 2px solid #3cd2c8;
	background: #3cd2c8;
	color: #fff;
	border-radius: 10px;
	transition: 0.5s;
}
a.cta_btn_dl:hover {
	color: #3cd2c8;
	background: #fff;
}
@media screen and (max-width: 960px) {
    a.cta_btn_dl{
    width: 100%;
    font-size:16px;
    padding: 18px 0 16px;
    }
}

a.cta_btn_mail {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 400px;
	margin: 20px auto 0;
	padding: 20px 0;
	font-weight: 600;
    font-size: 16px;
	border: 2px solid #f3a245;
	background: #f3a245;
	color: #fff;
	border-radius: 10px;
	transition: 0.5s;
}
a.cta_btn_mail:hover {
	color: #f3a245;
	background: #fff;
}
@media screen and (max-width: 960px) {
    a.cta_btn_mail{
    width: 100%;
    font-size:16px;
    padding: 18px 0 16px;
    }
}


/* 資料ダウンロードフォーム */
.download-doc-container{
  display: flex;
  max-width: 980px;
  padding: 50px 0px 130px 0px;
  margin: 0 auto;
}

.download-doc-img{
  width: 42%;
  text-align:center;
}

.download-doc-img img{
  width:100%;
/*  max-width: 408px;*/
}
.download-doc-form{
  width: calc(58% - 60px);
  padding: 0px 30px 0px 30px;
  min-height:300px;
}

@media screen and (max-width: 768px) {
  .download-doc-container{
    display: block;
    padding: 50px 0px 50px 0px;
  }

  .download-doc-img{
    margin: 0 auto;
    width: calc(100% - 60px);
    padding: 0px 30px 50px 30px;
  }

  .download-doc-form{
    margin: 0 auto;
    width: calc(100% - 60px);
  }
}


.dl-form-page-contents{
    background-color: #fff;
    padding: 0px 30px 150px;
}
@media screen and (max-width: 960px) {
    .dl-form-page-contents{
        margin-top: 50px;
    }
}
@media screen and (max-width: 640px) {
    .dl-form-page-contents{
        padding-bottom: 100px;
    }
}


/* 企業ロゴ */

.partner-logo-wrapper{
    max-width: 980px;
    padding: 100px 0 40px;
    margin: 0px auto;
}
@media screen and (max-width: 960px) {
    .partner-logo-wrapper{
    padding: 50px 0 20px;
    }
}

.partner-logo-box{
    text-align: center;
    margin-bottom: 60px;
}
@media screen and (max-width: 960px) {
    .partner-logo-box{
    margin-bottom: 30px;
    }
}

.partner-logo-title{
    font-size:30px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 30px;
    line-height: 43px;
    letter-spacing: 2px;
    color:#3e3e3e;
}
@media screen and (max-width: 960px) {
    .partner-logo-title{
    font-size: 25px;
    margin-bottom: 20px;
    line-height: 35px;
    }
}

.partner-logo-set{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 30px;
}
@media screen and (max-width: 960px) {
    .partner-logo-set{
    display: flex;
    margin: 0 30px 0px;
    justify-content: space-around;
    text-align: center;
    }
}

.partner-logo{
    padding:20px;
    height:50px;
}
@media screen and (max-width: 960px) {
    .partner-logo{
    padding:5px;
    height:40px;
    margin-bottom: 10px;
    object-fit: contain;
    }
}


.logo_slide_wrapper{
    margin-top: 20px;
    text-align: center;
}
@media screen and (max-width:640px) {
    .logo_slide_wrapper {
        margin: 0px 0 30px;
    }
}

.partner-slide-logo{
    padding:20px;
    height:50px;
}

.slide_img, .slide_img_sp{
    width: 100%;
}

.slide_img_sp {
    display: none;
}

@media screen and (max-width:640px) {
    .slide_img {
        display: none;
    }

    .slide_img_sp {
        display: block;
    }
}