/* ========================================================== ▼ フォント ▼ == */

/* ========================================================== ▼ パンくず ▼ == */
#breadlist {
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;  font-style: normal;
  font-size: calc(20 * (100vw / 750));
  letter-spacing: 0.07em;
  line-height: 1.6;
  text-align: left;
  color: #0C1026;
}
#breadlist .breadlist-area {
  display: flex;
  padding: calc(10 * (100vw / 750)) calc(30 * (100vw / 750));
}
#breadlist .breadlist-arrow {
  padding: 0 calc(8 * (100vw / 750));
}
@media screen and (min-width: 768px) {
  #breadlist {
    font-size: 10px;
  }
  #breadlist .breadlist-area {
    padding: 12px 50px;
    max-width: 1200px;
    margin: 0 auto;
  }
  #breadlist .breadlist-arrow {
    padding: 0 4px;
  }
}

/* ========================================================== ▼ 全体 ▼ == */
#official_app{
    margin: 0 auto calc(110*(100vw/750));
}
#official_app img{
	width: 100%;
	height: auto;
}

/*sec01*/
#official_app .title{
	width: calc(541 *(100vw/750));
	height: auto;
	margin: calc(60 *(100vw/750)) auto calc(45 *(100vw/750));
}
#official_app .app_icon{
	width: calc(200 *(100vw/750));
    margin: 0 auto calc(60 *(100vw/750));
}
#official_app .app_icon img{
	width: 100%;
	height: 100%;
}

/*sec02*/
#official_app .downloadfree_area{
	width: calc(750 *(100vw/750));
	margin: 0 auto calc(110 *(100vw/750));
	position: relative;
}

#official_app .downloadfree_area .download_btn{
	position: absolute;
    bottom: calc(80*(100vw/750));
    right: calc(130*(100vw/750));
}

#official_app .downloadfree_area .appstore_area{
	width: calc(293 *(100vw/750));
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 calc(15 *(100vw/750)) 0;
}
#official_app .downloadfree_area .appstore_area li{
	width: calc(182 *(100vw/750));
}
#official_app .downloadfree_area .appstore_area li.qr{
	width: calc(81 *(100vw/750));
}


#official_app .downloadfree_area .googleplay_area{
	width: calc(293 *(100vw/750));
	display: flex;
	align-items: center;
	justify-content: space-between;
}
#official_app .downloadfree_area .googleplay_area li{
	width: calc(182 *(100vw/750));
}
#official_app .downloadfree_area .googleplay_area li.qr{
	width: calc(81 *(100vw/750));
}

/*sec04*/
#official_app .sec_04 {
	width: calc(678 *(100vw/750));
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
    margin: 0 auto;	
}
#official_app .sec_04 .appstore_area,
#official_app .sec_04 .googleplay_area{
	width: calc(310 *(100vw/750));
	display: flex;
	align-items: center;
	justify-content: space-between;
}
#official_app .sec_04 .appstore_area li,
#official_app .sec_04 .googleplay_area li{
	width: calc(205 *(100vw/750));
	position: relative;
	padding-top: calc(35 *(100vw/750));
}
#official_app .sec_04 .appstore_area li:first-child::before,
#official_app .sec_04 .googleplay_area li:first-child::before{
    content: "";
    *background-image: url(../img/click.png);
    width: calc(156*(100vw/750));
    height: calc(18*(100vw/750));
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
}
#official_app .sec_04 .googleplay_area li.qr,
#official_app .sec_04 .appstore_area li.qr{
	width: calc(77 *(100vw/750));
}

/* ==================================================================================== ▼ PC ▼ == */
@media screen and (min-width: 768px) {
  /* ============================= ▼ 全体 ▼ == */
#official_app{
	width: 120rem;
    margin: 0 auto 12rem;
}

/*sec01*/
#official_app .title{
	width: 64.9rem;
	margin: 8rem auto 8.6rem;
}
#official_app .app_icon{
	width: 20rem;
    margin: 0 auto 9rem;
}

/*sec02*/
#official_app .downloadfree_area{
	width: 100%;
	margin: 0 auto 13.5rem;
	position: relative;
}

#official_app .downloadfree_area .download_btn{
	position: absolute;
    bottom: 9.1rem;
    right: 27rem;
}

#official_app .downloadfree_area .appstore_area{
	width: 35.2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 1.6rem 0;
}
#official_app .downloadfree_area .appstore_area li{
	width: 21.8rem;
}
#official_app .downloadfree_area .appstore_area li.qr{
	width: 9.7rem;
}


#official_app .downloadfree_area .googleplay_area{
	width: 35.2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
#official_app .downloadfree_area .googleplay_area li{
	width: 21.8rem;
}
#official_app .downloadfree_area .googleplay_area li.qr{
	width: 9.7rem;
}


/*sec03*/
#official_app .sec_03 {
	margin-bottom: 8rem;
}

/*sec04*/
#official_app .sec_04 {
	width: 81rem;
}
#official_app .sec_04 .appstore_area,
#official_app .sec_04 .googleplay_area{
	width: 36rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
#official_app .sec_04 .appstore_area li,
#official_app .sec_04 .googleplay_area li{
	width: 24.6rem;
	position: relative;
	padding-top: 3rem;
}
#official_app .sec_04 .appstore_area li:first-child::before,
#official_app .sec_04 .googleplay_area li:first-child::before{
    content: "";
    *background-image: url(../img/click.png);
    width: 15.6rem;
    height: 1.8rem;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
}
#official_app .sec_04 .appstore_area li.qr,
#official_app .sec_04 .googleplay_area li.qr{
	width: 9.1rem;
}

}