/*基本*/
/********背景白余白あり*******/
#st_all01{
width:480px;
background:#fff;
margin:0px auto;
padding:0;
padding:0;
}

/*--------------------------------
▲ ウィンドウ幅が800px以上の場合 ▲
--------------------------------*/
/*--------------------------------
▼ ウィンドウ幅が799px以下の場合 ▼
--------------------------------*/
@media screen and (max-width:799px){
#st_all01{
width:100%;
background:#FFF;
margin:0 auto;
padding:0px 0px;
}
}

.sk_floatcl{
clear:both;　/*floatの解除、ここがポイント*/
}


/*おすすめ枠*/
.os_box_220903_19{
padding:2px;
font-size:20px;
color:#FABE00;
font-weight:bold;
}


.os_box_220903_20{
padding:2px 0px;
}


/*画像枠*/
.os_box_220903_21{
width:15%;
float:left;
padding:4px;
}


/*おすすめコメント枠*/
.os_box_220903_22{
width:80%;
padding:2px 0px 0px 10px;
color:#555;
font-size:14px;
line-height: 1.2em;
font-weight:bold;
}

span.os_text_220903_07{
font-size:20px;
/*text-shadow: 1px 1px 1px #CCC;*/
color:#000;/*#EA0000赤*/
}


/*カバーイメージ3枚並び画像*/
.sk_new_box_230529_06{
width:98%;
padding:4px;
margin:0px auto;
background:#FFF;/*#0085B2*/
text-align:center;
}


.sk_new_box_230529_07{
width:32%;
float:left;
padding:2px;
box-shadow: 0px 1px 3px 1px #999;/*横 縦 ぼかし 広さ 色*/
}


img.sk_img_221115_01{
width: 100%;
height: 180px;
object-fit: cover;
object-position: 50% 0%;
border: solid 0px #5EB494;/*#0099D9*/
border-radius: 0px;
}



.st_box_230412_01 {
  top: 0%; /* 画面上から50px */
  left: 0%; /*画面左から50px*/
z-index: 10;
  position: -webkit-sticky; /* Safariに対応する */
  position: sticky; /* 要素を固定/解除する */
}

/*st_box_230412_01これと連動している*/
.st_box_230412_02{
width:100%;
}


.sk_box_220903_12{
width:20%;
padding:6px;
float:left;
position:relative;
}

/*テキストリンク部分*/
.sk_box_220903_13{
width:70%;
padding:4px;
float:left;
line-height: 1.0em;
}

/*ストアページ右側文字部分囲い*/
.sk_box_220903_14{
line-height: 1.0em;
padding:4px 2px;
}

/*ストアーページタイトル*/
span.sk_text_220903_03{
font-weight: bold;
color:#FBF445;
font-size: 18px;
letter-spacing:0.5px;
}

/*ストアーページ会社*/
span.sk_text_220903_04{
font-weight: bold;
color:#FFF;
font-size: 12px;
letter-spacing:0.5px;
}

/*公式インストール*/
.sk_box_220903_16{
width:96%;
margin:0.4em auto 0px auto;
color:#FFF;
font-weight:bold;
font-size:15px;
text-align:center;
padding:8px 2px;
border: 2px solid #FFF;
}


.store_rev_221225_01{
width:92%;
padding: 10px;
border: 1px solid #CCC;
line-height:1.3em;
color:#000;
margin:12px auto;
background: #FFF;
}

span.store_text_221202_01{
font-weight: bold;
font-size: 16px;
color:#ff44b4;
}



.store_box_230524_01{
line-height:1.3em;
}

/*上側プレイボタン*/
.sk_btn_22_0903_02{
position: relative;
width:86%;
font-weight: bold;
padding: 20px 0px;
margin: 12px auto 12px auto;
border-radius: 6px;
font-size: 18px;/*文字サイズ*/
background-color: #FF0090;/*背景色*/
color:#FFF;
border:1px solid #00AA00;
display: inline-block;
text-align:center;
box-shadow: 0 3px 5px rgb(0, 0, 0, 0.3);
border-top: 1px solid #000;
border-left: 1px solid #000;    
border-right: 3px solid #000;
border-bottom: 3px solid #000;
}
.sk_btn_22_0903_02:before {
font-family: FontAwesome;
content: '';/*好きなアイコン*/
color:#3671F6;/*アイコンの色*/
margin-right: 3px;
}
a:hover .sk_btn_22_0903_02 {
background-color: #FF0090;/*触れたときの背景色*/
color:#FFF;/*触れたときの文字色*/
box-shadow: 0 0px 0 rgb(0, 0, 0, 0.3);
animation-play-state: paused;
top: 3px;
border:1px solid #00AA00;
}  



.store_box_230720_01{
border-bottom:1px solid #999;
padding:4px;
margin:12px auto;
}

.store_box_230720_02{
width:96%;
padding:4px;
margin:12px auto;
line-height:1.3em;
}

.store_box_230720_02a{
margin:20px auto 12px auto;
}



/*コンテンツ*/
.store_box_230720_03{
width:96%;
font-size:16px;
font-weight:bold;
padding:4px;
margin:12px auto;
line-height:1.3em;
background:#FFF;/*#35758A*/
}

/*下段基本情報タイトル*/
.store_box_230720_04 {
background:#555;/*#35758A*/
color:#FFF;
font-size:18px;
font-weight:bold;
padding:0px;
}


/*下段基本情報*/
.store_box_230720_05{
padding:10px 6px;
line-height: 1.6em;
background:#AAA;
border: 0px solid #ccc;
color:#FFFFFF;
background-image: linear-gradient(
/*斜め45度から*/45deg,
#666666 25%,/*カラー1#4392AE*/
#888 25%, #888 50%,/*カラー2*/
#666666 50%, #666666 75%,/*カラー1*/
#888 75%, #888/*カラー2*/);

/* 幅8px、高さ8pxで背景画像の斜線サイズ*/
background-size: 4px 4px;
}

/*各タイトル帯*/
.store_box_230720_06{
width:96%;
margin:0px auto;
padding:20px 6px;
background: #F6F6F6;
border-left:4px solid #00A3D9;
color:#444444;
box-shadow: 1px 1px 3px #888;
-webkit-box-shadow: 1px 1px 3px #888;
-moz-box-shadow: 1px 1px 3px #888;
}


h2#sk_h2_text230720_01{
font-weight:bold;
font-size:20px;
line-height: 1.2em;
letter-spacing: 2px;
color:#333;
}

h3#sk_h3_text230721_01{
font-weight:bold;
font-size:20px;
line-height: 1.2em;
letter-spacing: 2px;
color:#555;
}

span.store_text_230720_01{
font-weight: bold;
font-size: 46px;
color:#999;
}

span.store_text_230722_01{
font-weight: bold;
font-size: 14px;
color:#555;
}


.sk_new_box_230721_01{
width:35%;
padding:4px;
float:left;
}


.sk_new_box_230721_02{
width:60%;
padding:4px;
float:left;
}

.sk_new_box_230721_03{
width:100%;
padding:4px;
line-height:1.0em;
}


.sk_new_box_230721_04{
font-size:14px;
color:#555;
line-height: 1.4em;
}


.sk_new_box_230721_05{
width:96%;
font-size:16px;
padding:4px;
margin:12px auto;
line-height:1.3em;
background:#FFF;/*#35758A*/
}


.sk_new_box_230721_06{
width:96%;
font-size:16px;
padding:4px;
background:#FFF;/*#35758A*/
}


.sk_new_box_230721_07{
width:15%;
padding:4px;
float:left;
}

.sk_new_box_230721_08{
width:80%;
padding:4px;
float:left;
}






/*-----------スライダー等の特別-----------------*/
/*縦長用スライダー*/
.sk_slider4 {
  width: 100%;
  text-align: center;
  overflow: hidden;
  margin: 20px 0;
}

.sk_slides4 {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  /*
  scroll-snap-points-x: repeat(300px);
  scroll-snap-type: mandatory;
  */
}
.sk_slides4::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.sk_slides4::-webkit-scrollbar-thumb {
  background: black;
  border-radius: 10px;
}
.sk_slides4::-webkit-scrollbar-track {
  background: transparent;
}
.sk_slides4 > div {
  scroll-snap-align: start;
  flex-shrink: 0;
  width: 60%;/*80%*/
max-height: 500px;/*←これは適当に追加*/
/*height: 500px;デフォるとはこっち*/
  margin-right: 50px;
  border-radius: 10px;
  background: #eee;
  transform-origin: center center;
  transform: scale(1);
  transition: transform 0.5s;
  position: relative;
  
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
}
.sk_slides4 > div:target {
/*   transform: scale(0.8); */
}
.author-info4 {
  background: rgba(0, 0, 0, 0.75);
  color: white;
  padding: 0.75rem;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  margin: 0;
}
.author-info4 a {
  color: white;
}
img4 {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.sk_slider4 > a {
  display:none;
  width: 1.5rem;
  height: 1.5rem;
  background: white;
  text-decoration: none;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin: 0 0 0.5rem 0;
  position: relative;
}
.sk_slider4 > a:active {
  top: 1px;
}
.sk_slider4 > a:focus {
  background: #000;
}

/* Don't need button navigation */
@supports (scroll-snap-type) {
  .sk_slider4 > a {
    display: none;
  }
}






/*非表示をコメントアウトしています*/



/*横幅スライダー*/
/*縦長用スライダー*/
.sk_slider5 {
  width: 100%;
  text-align: center;
  overflow: hidden;
  margin: 20px 0;
}

.sk_slides5 {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  /*
  scroll-snap-points-x: repeat(300px);
  scroll-snap-type: mandatory;
  */
}
.sk_slides5::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.sk_slides5::-webkit-scrollbar-thumb {
  background: black;
  border-radius: 10px;
}
.sk_slides5::-webkit-scrollbar-track {
  background: transparent;
}
.sk_slides5 > div {
  scroll-snap-align: start;
  flex-shrink: 0;
  width: 80%;/*80%*/
max-height: 500px;/*←これは適当に追加*/
/*height: 500px;デフォるとはこっち*/
  margin-right: 50px;
  border-radius: 10px;
  background: #eee;
  transform-origin: center center;
  transform: scale(1);
  transition: transform 0.5s;
  position: relative;
  
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
}
.sk_slides5 > div:target {
/*   transform: scale(0.8); */
}
.author-info5 {
  background: rgba(0, 0, 0, 0.75);
  color: white;
  padding: 0.75rem;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  margin: 0;
}
.author-info5 a {
  color: white;
}
img5 {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.sk_slider5 > a {
  display:none;
  width: 1.5rem;
  height: 1.5rem;
  background: white;
  text-decoration: none;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin: 0 0 0.5rem 0;
  position: relative;
}
.sk_slider5 > a:active {
  top: 1px;
}
.sk_slider5 > a:focus {
  background: #000;
}

/* Don't need button navigation */
@supports (scroll-snap-type) {
  .sk_slider5 > a {
    display: none;
  }
}


/*非表示をコメントアウトしています*/







/*レーティングcss*/
.star5_rating{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC; /* グレーカラー 自由に設定化 */
    /*font-size: 30px; フォントサイズ 自由に設定化 */
}

.star5_rating:before, .star5_rating:after{
    content: '★★★★★';
}

.star5_rating:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #ffcf32; /* イエローカラー 自由に設定化 */
}

.star5_rating[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5_rating[data-rate="4.9"]:after{ width: 98%; }
.star5_rating[data-rate="4.8"]:after{ width: 96%; }
.star5_rating[data-rate="4.7"]:after{ width: 94%; }
.star5_rating[data-rate="4.6"]:after{ width: 92%; }
.star5_rating[data-rate="4.5"]:after{ width: 90%; }
.star5_rating[data-rate="4.4"]:after{ width: 88%; }
.star5_rating[data-rate="4.3"]:after{ width: 86%; }
.star5_rating[data-rate="4.2"]:after{ width: 84%; }
.star5_rating[data-rate="4.1"]:after{ width: 82%; }
.star5_rating[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5_rating[data-rate="3.9]:after{ width: 78%; }
.star5_rating[data-rate="3.8]:after{ width: 76%; }
.star5_rating[data-rate="3.7]:after{ width: 74%; }
.star5_rating[data-rate="3.6]:after{ width: 72%; }
.star5_rating[data-rate="3.5]:after{ width: 70%; }
.star5_rating[data-rate="3.4]:after{ width: 68%; }
.star5_rating[data-rate="3.3]:after{ width: 66%; }
.star5_rating[data-rate="3.2]:after{ width: 64%; }
.star5_rating[data-rate="3.1]:after{ width: 62%; }
.star5_rating[data-rate="3]:after{ width: 60%; }
.star5_rating[data-rate="2.9]:after{ width: 58%; }
.star5_rating[data-rate="2.8]:after{ width: 56%; }
.star5_rating[data-rate="2.7]:after{ width: 54%; }
.star5_rating[data-rate="2.6]:after{ width: 52%; }
.star5_rating[data-rate="2.5]:after{ width: 50%; }
.star5_rating[data-rate="2.4]:after{ width: 48%; }
.star5_rating[data-rate="2.3]:after{ width: 46%; }
.star5_rating[data-rate="2.2]:after{ width: 44%; }
.star5_rating[data-rate="2.1]:after{ width: 42%; }
.star5_rating[data-rate="2]:after{ width: 40%; }
.star5_rating[data-rate="1.9]:after{ width: 38%; }
.star5_rating[data-rate="1.8]:after{ width: 36%; }
.star5_rating[data-rate="1.7]:after{ width: 34%; }
.star5_rating[data-rate="1.6]:after{ width: 32%; }
.star5_rating[data-rate="1.5]:after{ width: 30%; }
.star5_rating[data-rate="1.4]:after{ width: 28%; }
.star5_rating[data-rate="1.3]:after{ width: 26%; }
.star5_rating[data-rate="1.2]:after{ width: 24%; }
.star5_rating[data-rate="1.1]:after{ width: 22%; }
.star5_rating[data-rate="1]:after{ width: 20%; }
.star5_rating[data-rate="0.9]:after{ width: 18%; }
.star5_rating[data-rate="0.8]:after{ width: 16%; }
.star5_rating[data-rate="0.7]:after{ width: 14%; }
.star5_rating[data-rate="0.6]:after{ width: 12%; }
.star5_rating[data-rate="0.5]:after{ width: 10%; }
.star5_rating[data-rate="0.4]:after{ width: 8%; }
.star5_rating[data-rate="0.3]:after{ width: 6%; }
.star5_rating[data-rate="0.2]:after{ width: 4%; }
.star5_rating[data-rate="0.1]:after{ width: 2%; }
.star5_rating[data-rate="0]:after{ width: 0%; }