@charset "utf-8";
/* CSS Document */
/*@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@700&display=swap');*/
/*@font-face {
 font-family: 'M PLUS Rounded 1c';
 font-style: Bold;
 font-style: Medium;
 font-style: Regular;
 src: url("../font/MPLUSRounded1c-Bold.ttf") format("truetype");
 src: url("../font/MPLUSRounded1c-Medium.ttf") format("truetype");
 src: url("../font/MPLUSRounded1c-Regular.ttf") format("truetype");
}*/
@font-face {
 font-family: 'M PLUS Rounded 1c';
 font-style: normal;
 font-weight: 400;
 src: url("../font/MPLUSRounded1c-Regular.ttf") format("truetype");
}
@font-face {
 font-family: 'M PLUS Rounded 1c';
 src: url("../font/MPLUSRounded1c-Medium.ttf") format("truetype");
 font-style: Medium;
 font-weight: 500;
}
@font-face {
 font-family: 'Rounded Mplus 1c';
 src: url("../font/MPLUSRounded1c-Bold.ttf") format("truetype");
 font-style: bold;
 font-weight: 700;
}
html {
 font-size: 62.5%;
}
body {
 font-family: 'M PLUS Rounded 1c', sans-serif;
 /* font-style: bold;*/
 /*font-style: bold;*/
 font-weight: 700;
 /*font-weight: bold;*/
 font-size: 20px;
 line-height: 1.8;
 color: #615223;
 background: #FAFAEB;
}
img {
 vertical-align: top;
}
#wrap {
 text-align: center;
 /*overflow-x: hidden;*/
 overflow: hidden;
}
.w860 {
 width: 100%;
 max-width: 860px;
 margin: 0 auto;
}
div#main {
 width: 100%;
 /*max-width: 1280px;*/
 /*height: 100vh;*/
 height: 926px;
 margin: 0 auto;
 background: url("../img/pc/main_bg.png") no-repeat 0 0 / cover;
 background-position: center;
 /*background-size: cover;*/
 /*background-repeat: no-repeat;*/
 /*background-size: 100% 100%;*/
 /*position: relative;*/
}
/*div#main::after{
content: '';
  border-top-left-radius: 50% 100%;
  border-top-right-radius: 50% 100%;
  position: absolute;
  bottom: 0;
	left:0;
  width: 100%;
  background: #FAFAEB;
  height: 60px;
}*/

@media screen and (min-width:1280px){
div#main{
background: url("../img/pc/main_bg_max.png") no-repeat 0 0 / cover;
background-position: center;
}
}

#main .box {
 margin-top: -2px;
 width: 90%;
 max-width: 1170px;
 padding-top: 70px;
 margin: 0 auto;
}
/*img.scroll {
 width: 88.57px;
 position: relative;
 bottom: 180px;
 z-index: 10;
}*/
.contents {
 /*margin-top: -240px;*/
}
.circle {
 /*width:1280px;
height:80px;
background:#fafaeb;
border-radius:50% 50% 0 0/100% 100% 0 0; position:relative;
bottom:80px;
margin:0 auto;*/
 /*width: 100%;
 height: 80px;
 background: url("../img/pc/circle_bg.png") no-repeat 0 0 / cover;
 background-position: center;
 position: relative;
 bottom: 260px;*/
}

/*
===========
フォント設定
===========
*/
/*ジャギ防ぐ*/
p, #catalog, #feature, nav, footer, #price {
 transform: rotate(0.03deg);
}
.center {
 text-align: center;
}
.pc_fontsize10 {
font-size: 10px;
}
.pc_fontsize14 {
 font-size: 14px;
}
.pc_fontsize16 {
 font-size: 16px;
}
.pc_fontsize20 {
 font-size: 20px;
}
.pc_fontsize24 {
 font-size: 24px;
}
.pc_fontweight_400 {
 font-style: normal;
 font-weight: 400;
}
.pc_fontweight_500 {
 font-style: Medium;
 font-weight: 500;
}
.pc_fontweight_700 {
 font-style: bold;
 font-weight: 700;
}
.fontcolor_gray {
 color: #84807A;
}
/*
===========
マージン設定
===========
*/
.pc_marginbottom38 {
 margin-bottom: 38px;
}
.pc_marginbottom60 {
 margin-bottom: 60px;
}
/*
===========
リンク設定
===========
*/
a{
-webkit-tap-highlight-color: transparent;
}
.anchor{
display: block;
  padding-top:80px;
  margin-top:-80px;
}

.area a {
 /*font-weight: 400;
font-size: 16px;
color: #615F5B;
text-decoration-line: underline;*/
 -webkit-tap-highlight-color: transparent;
 color:inherit;
 text-decoration: none;
}
.openbtn1 {
 -webkit-tap-highlight-color: transparent;
}
.external-link {
 white-space: nowrap;
}
.external-link::after {
 content: "";
 display: inline-block;
 /*content: url("../img/external_link.png");*/
 width: 15%;
 max-width: 24.5px;
 height: 60%;
 background-image: url("../img/external_link.png");
 /*background-size: contain;*/
 /*vertical-align: middle;*/
 /*background-repeat: no-repeat;*/
 background-size: cover;
 vertical-align: middle;
 background-repeat: no-repeat;
 background-position: center center;
 margin-left: 8.5px;
 margin-bottom: 4%;
}
#price a.textlink {
 font-weight: 400;
 font-size: 16px;
 color: #615F5B;
 text-decoration-line: underline;
}
/*
===========
見出し設定
===========
*/
h2 {
 /*width: 912px;*/
 margin-bottom: 24px;
}
h2 img {
 width: auto;
 height: 61px;
}
/*
===========
ボタンデザイン
===========
*/
a.btn_orange {
 width: 378px;
 height: 68px;
 /*width: 218px;
 height: 36px;*/
 background: #F06D01;
 color: #fff !important;
 text-align: center;
 /*padding: 16px 80px;*/
 padding: 0 80px;
 border-radius: 50vw;
 /*font-size: 16px;*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}
#hamburger a.btn_orange {
 font-size: 16px;
}
#catalog a.btn_orange, #price a.btn_orange {
 font-size: 24px;
}
/*20231208*/
/*#trial,.pc-none {
 display: none;
}*/
.pc-none {
 display: none;
}
 #trial {
  display: block;
  position: fixed;
  width: 15%;
  max-width: 180px;
  bottom: 0;
  /*right: 3.5%;*/
  right: 2%;
  z-index: 50;
 }
/*ｺｺﾏﾃﾞ20231208*/
a.btn_big {
 transition-duration: .4s;
}
a.btn_big:hover {
 transform: scale(1.1);
}
/*
===========
ヘッダデザイン
===========
*/
.header_wrap {
 width: 100%;
 background: rgba(255, 255, 255, 0.7);
 position: fixed;
 top: 0;
 z-index: 100;
}
.header_content {
 width: 100%;
 max-width: 1280px;
 margin: auto;
 clear: both;
}
header {
 width: 98px;
 /*height: 72px;*/
 float: left;
}
header h1 {
 text-align: left;
}
header h1 img {
 width: 98px;
 margin: 20px 48px;
}
#hamburger {
 /*margin-right: 40px;*/
 float: right;
}
#hamburger #g-nav-list {
 margin-right: 40px;
 margin-top: 16px;
}
#hamburger ul {
 display: flex;
 justify-content: flex-end;
 align-items: center;
}
#hamburger .btn_orange {
 width: 160px;
 height: 35px;
 padding: 0;
 padding-top: 3px;
}
#hamburger .hamburger-list ul li:not(last-child) {
 margin-left: 40px;
}
#hamburger .hamburger-list ul li a:not(last-child) {
 /*font-weight: 500;
 font-size: 16px;*/
 color: #785116;
 text-decoration: none;
}
.g-nav_share {
 display: none !important;
}
#navi {
 margin: 0 auto;
}
ul.menu {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 margin-top: 10px;
}
.menu-left {
 width: 98px;
 height: 32px;
 margin: 20px 0 0;
}
.menu-parent a.btn_orange {
 width: 160px;
 height: 40px;
 padding: 8px 16px;
 line-height: 2;
}
/*
===========
コンテンツ設定
===========
*/
#ex, #catalog {
 width: 100%;
 max-width: 912px;
 margin: auto;
}
#catalog, #feature {
  margin-top: 112px;
}
/*
===========
「できた！」を応援する知育サービスデザイン
===========
*/
#ex h3 {
 margin-top: 60px;
}
/*
===========
アプリカタログデザイン
（tab切り替えデザイン）
===========
*/
 #catalog .tab {
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  /*overflow-scrolling: touch;
  -webkit-overflow-scrolling: touch;
	-ms-overflow-style: none; */
	-webkit-tap-highlight-color: transparent;
	/*横スクロールバーは出ないが横スクロールはできる*/
	overflow: scroll;/*chrome、safari対応*/
	-ms-overflow-style: none;/*Edge対応*/
	scrollbar-width: none;/*FireFox対応*/
 }
 #catalog .tab::-webkit-scrollbar{
 display: none;/*chrome、safari対応*/
 }
 #catalog .tabscroll {
  white-space: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
 }
.wrapper {
 margin-top: 28px;
}
.tab {
 margin: 24px auto;
}
.tab li {
 font-size: 24px;
 font-weight: 700 !important;
 /*font-weight: Bold !important;*/
 color: #615223;
 text-align: center;
 padding: 4px 16px;
 margin-right: 16px;
 background: #F0EDDF;
 border-radius: 24px;
}
.tab li:last-child {
 margin-right: 0;
}
.tab li a {
 font-weight: 700;
 font-size: 24px;
 color: #615223;
 text-decoration: none;
}
.tab li.active {
 background: #FCD253;
}
.area {
 background: #ffffff;
 border: 10px solid #F0EDDF;
 border-radius: 36px;
 padding-bottom: 47px;
 margin: 12px auto 24px;
 padding: 30px 40px 43px;
}
.area .age_title {
 width: 100%;
}
.area .age {
 color: #F6AB00;
 background: #FFFAE8;
 width: 140px;
 height: 80px;
 border-radius: 20px;
 text-align: center;
 float: left;
 margin-right: 24px;
 font-size: 20px;
 font-weight: 700;
}
.area .age_num {
 font-size: 44px;
 font-weight: 700;
}
.area .age_unit {
 font-size: 26px;
 font-weight: 700;
}
.area .text {
 /*float: left;*/
 text-align: left;
 font-size: 24px;
 font-weight: 500;
 overflow: hidden;
}
.area .app_icon {
 width: 120px;
}
.area .app_box {
 margin: 29px 60px 0;
 display: flex;
 flex-direction: row;
 justify-content: center;
}
.area .app {
 width: 312px;
 float: left;
}
.area .app_name {
 color: #615F5B;
 width: 312px;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 font-size: 24px;
 font-weight: 700;
}
.area .genre_box {
 margin: 0 auto;
 display: flex;
 flex-direction: row;
 justify-content: center;
}
.area .genre {
 /*width: 60px;*/
 /*height: 30px;*/
 color: #615F5B;
 font-size: 20px;
 font-weight: 400;
 border: 1px solid #615F5B;
 border-radius: 24px;
 /*padding: 3px 12px 5px;*/
 padding: 0 12px;
 margin-right: 16px;
 margin-top: 8px;
 white-space: nowrap;
}
/*
===========
dキッズの特長デザイン
===========
*/
.fe_box {
 padding-bottom: 107px;
 width: 100%;
 margin: auto;
 font-size: 24px;
 font-weight: 700;
}
.fe_box:nth-child(even) {
 background: url("../img/pc/bg_right.png") no-repeat top right;
 background-size: auto;
}
.fe_box:nth-child(odd) {
 background: url("../img/pc/bg_left.png") no-repeat top left;
 background-size: auto;
}
section.fe_box div {
 width: 100%;
 max-width: 912px;
 margin: auto;
}
/*
===========
dキッズのアプリを見てみようデザイン
===========
*/
#app {
 position: relative;
 overflow: hidden;
 /*padding-top: 600px;*/
 /*width: 100vw;
background: url("../img/pc/app_bg_bottom.png") no-repeat top;
background-size: cover;*/
}
#app img.caractor {
 width: 140px;
 position: absolute;
 top: 4%;
 left: 10%;
}
#app .hr {
 width: 216px;
 position: relative;
 top: 80px;
}
#app.bg {
 width: 100%;
}
#app .full-width {
 background: #E3F4F5;
 width: 100vw;
 /*margin: -730px calc(50% - 50vw) 0;*/
}
#app .full-width-inner {
 width: 770px;
 margin: 0 auto;
 padding-top: 100px;
 padding-bottom: 85px;
}
#app .auth {
 width: 912px;
 margin: auto;
 font-size: 24px;
 margin-bottom: 134px;
}
#app .auth .company {
 background: #ffffff;
}
#app .auth .company img {
 width: 540px;
 margin: 115px auto;
}
#app .auth p {
 margin: 40px auto 0;
}
video {
 width: 100%;
 margin: auto;
 filter: drop-shadow(0px 0px #000);
 outline: none;
 border: none;
}
.video {
 text-align: center;
}
#app .animal {
 position: relative;
 bottom: 0;
 max-width: 1280px;
}
/*
===========
価格表デザイン
===========
*/
#price .ribon {
 text-align: center;
 width: 215px;
 position: relative;
 top: -63px;
 z-index: 50;
}
#price {
 margin: 0 auto;
 padding-bottom: 40px;
 /*padding: 62px auto 40px;*/
}
#price .btn_orange {
 margin-top: 35px;
}
#price hr {
 width: 776px;
 border: 2px solid #F3EED8;
 border-radius: 2px;
 margin: 38px auto 31px;
 text-align: center;
}
/*
===========
インストールデザイン
===========
*/
#install {
 background: #ffffff;
 padding-top:48px;
}
#install .install_wrap {
 width: 100%;
 max-width: 1280px;
 margin: auto;
 margin-bottom: -106px;
}
#install h2 img {
 height: auto;
 width: 100%;
}
.install_download {
 text-align: center;
 width: 50%;
 position: relative;
 bottom: 330px;
 left: 50%;
}
@media screen and (min-width:1024px) and (max-width:1150px){
.install_download {
 text-align: center;
 width: 50%;
 position: relative;
 bottom: 300px;
 left: 50%;
}
}
.install_download p {
 color: #84807A;
}
.btn_install {
 margin-top: 20px;
 /*float: left;
position: relative;
left: 50%;*/
}
.btn_install a {
 /*padding: 16px 44px;*/
 padding: 12px 44px;
 background: #FFFFFF;
 border: 2px solid #F06D01;
 border-radius: 32px;
 font-size: 16px;
 font-weight: 700;
 color: #F06D01;
 display: block;
 text-decoration: none;
}
/*.btn_install a:first-child{
width: 67px;
    height: 24px;
}
.btn_install a:last-child{
width: 102px;
height: 24px;
}*/
.btn_install a.ios {
 width: 155px;
 height: 56px;
 /*width: 67px;
 height: 24px;*/
 white-space: nowrap;
}
.btn_install a.android {
 width: 190px;
 height: 56px;
 /*width: 102px;
 height: 24px;*/
 white-space: nowrap;
}
.install_box {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 justify-content: center;
}
.btn_install:first-child {
 margin-right: 16px;
}
/*
===========
フッターデザイン
===========
*/
footer {
 /*height: 145px;*/
 padding-top: 75px!important;
 padding-bottom: 45px;
 background: #CCBE8C !important;
 color: #ffffff;
}
footer .content {
 width: 558px;
 margin: 0 auto;
}
footer .footer_logo {
 width: 117px;
 float: left;
}
.footer_share {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 float: right;
}
.share_btn {
 /*margin-left: 16px;*/
 margin: 0 8px;
 width: 40px;
}
.small {
 font-weight: 400;
 font-size: 14px;
 /*margin-top: 8px;*/
}
footer .clear_fix {
 margin-bottom: 40px;
}

/*外部送信規律追加*/
#footer {
    text-align: center;
    padding-top: 33px;
}
.footer_link{
	text-align: center;
    padding-top: 33px;
	text-decoration: none;
}
#footer .footer_link::before {
    content: "";
    display: inline-block;
    width: 4px;
    height:8px;
    background-image: url(../img/arrow.png);
    background-size: cover;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: center center;
	margin-right: 9px;
	margin-bottom: 0.5%;
}

.footer_link a{
	text-decoration: none;
}
#footer a {
    color: #fff;
}
#footer hr {
    border: #ffffff solid 1px;
    width: 100%;
    margin: 25px auto 40px;
}

/*
===========
ClearFix
===========
*/
.clear_fix::after {
 content: "";
 clear: both;
 display: block;
}