@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP|Roboto|Roboto+Condensed&display=swap');
@media only screen and (orientation:landscape) and (max-width : 813px),(orientation:portrait) and (max-width : 753px){
body .post .mokujiInfo_ac ul li a,
body .post .review_sort_box a,
body .post a.cvBts-haru,
body .post a.cvBts-heart,
body .post a.happymail-doku,
body .post a.happymail-kikon {
text-decoration: none
}
/*body a,
body button,
body div,
body h2,
body h3,
body p,
body select {
font-family: Roboto, 'Noto Sans JP', sans-serif
}*/
body {
background-color: #FFF;
box-sizing: border-box
}
body,
html {
width: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
background: #fff
}
html {
overflow-y: scroll;
overflow-x: hidden
}
img {
height: auto;
max-width: 100%
}
input,
textarea {
max-width: 95%
}
input[type=submit],
input[type=image],
input[type=reset],
input[type=button],
input[type=file] {
max-width: none
}
.pc-none {
display: block
}
.sp-none {
display: none
}
#sidebar-new-3 ul.ri-app-list.pc-none {
display: block
}
#sidebar-new-3 ul.ri-app-list.sp-none {
display: none
}
.sticky-block {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 3
}
#main-contents .center th {
text-align: center
}
{
padding-top: 0;
padding-bottom: 15px
}
#breadcrumbs,
#footer,
#footer-banner,
#global-nav,
#header,
#main-image,
#top,
.copyright {
width: 100%;
min-width: 100%;
box-sizing: border-box;
overflow: hidden
}
#container,
#main {
width: 100%;
min-width: 100%;
box-sizing: border-box
}
#breadcrumbs ol,
#footer-banner ul,
#footer-in,
#global-nav-in,
#main-image-in,
#main-in,
#top-in,
.copyright p {
width: 100%;
margin: 0;
box-sizing: border-box
}
#main-and-sub,
#main-contents,
#sidebar,
#sub-contents {
float: none;
width: 100%;
box-sizing: border-box
}
#main-contents p {
margin-bottom: 20px
}
#main-contents .contents {
margin: 0 0px 20px
}
.article {
display: block
}
#main-contents .app-main br,
#main-contents .app-main p:empty,
#main-contents .appguide-box br,
#main-contents .appguide-box p:empty,
#main-contents .chumokuapp-box br,
#main-contents .chumokuapp-box p:empty,
#main-contents .mapplist-box br,
#main-contents .mapplist-box p:empty,
#main-contents .new2-box br,
#main-contents .new2-box p:empty,
#main-contents .ninkirank-box br,
#main-contents .ninkirank-box p:empty,
#main-contents .top-slide-box br {
display: none
}
#main-contents .chumokuapp-box p:last-child {
margin: 0;
padding: 0;
height: auto;
line-height: 0;
display: block
}
#main-contents .top-slide-box p:empty {
display: none
}
#main-contents .head-logo {
display: flex;
display: -webkit-flex;
align-items: center;
width: 100%;
background-color: #fff;
height:auto;
padding:10px 0;
}
#main-contents .head-logo p.logo {
display: inline-block;
text-align: center;
width: 73%;
margin: 0;
vertical-align: middle;
line-height: 0
}
.drawer-menu,
.drawer-menu-list ul {
display: none
}
.drawer-menu {
position: fixed;
left: 0;
top: 0;
height: 100%;
width: 100%;
overflow: auto;
background-color: rgb(255 249 249 / 90%);
z-index: 2147483647
}
.drawer-menu-box {
padding:48px 0 0;
}
.drawer-menu-list {
background-color: #fff
}
.submenu-control {
position: absolute;
right: 10px;
color: #dbae93;
}
.drawer-menu li,
.drawer-menu-title {
border-bottom: solid 1px #dadada
}
.drawer-menu-title {
font-size: 15px;
padding: 10px;
line-height: 20px;
font-weight: 700;
/* background: url(https://oripalette.jp/media/img/common/design/bt-bg.png)no-repeat center right; */
background-color: #a69cf1;
background-size:185%;
color: #FFF;
}
.drawer-menu-list li {
background: #FFF;
position: relative;
line-height: 40px;
padding: 0 5px
}
.drawer-menu-list li a {
display: block;
width: 100%;
height: 100%;
box-sizing: border-box;
font-size: 12px;
line-height: normal;
padding: 10px 5px;
border-left: 3px solid #ffb5be4a;
color:#162763;
}
.drawer-menu-list .drawer-menu-level2 li {
background-color: #f5f5f5
}
.drawer-menu-list .drawer-menu-level2 li a {
border: 0
}
.drawer-menu-close-button {
position: fixed;
top: 0;
right: 0;
height:48px;
width:100%;
z-index: 1
}
.drawer-background-fixed {
position: fixed;
width: 100%;
overflow-y: scroll
}
.drawer-menu-box:after {
content: "×";
font-size: 38px;
position: fixed;
left:0;
top:0;
width: 50px;
line-height: 48px;
border-radius:0;
background: #dbae93;
text-align: center;
color:#FFF;
}
#gNavi_button ul#menu-gnavi2,
.topNavi-modal-menu,
.topNavi-modal-menu-items{
display: none
}
body.home #breadcrumbs {
display: block;
width: 100%;
min-width: 100%;
font-size: 10px;
border-top: 1px solid #ededed;
border-bottom: 1px solid #ededed;
color: #777;
margin: 0;
background: #f5f5f5;
padding: 0;
box-sizing: border-box;
line-height: 25px
}
#breadcrumbs ol {
white-space: nowrap;
padding: 0 0 0 5px;
overflow: auto;
background:#f0f3f4;
}
#sidebar-47 {
display: none
}
#main-contents #sidebar-51 {
margin-bottom: 15px
}
#main-contents #sidebar-51 h3,
#main-contents #sidebar-52 h3 {
color: #FFF;
background: url('https://oripalette.jp/media/img/common/top/h2-wbg-r.png') right center/20px no-repeat, url('https://oripalette.jp/media/img/common/top/h2-wbg-l.png') left center/20px no-repeat #f7568a;
font-size: 18px;
font-weight: 700;
padding: 8px 10px;
margin-bottom: 24px;
text-align: center
}
#main-contents #sidebar-51 h3:before,
#main-contents #sidebar-52 h3:before {
content: '';
display: inline-block;
width: 26px;
height: 20px;
vertical-align: middle;
background: url('https://oripalette.jp/media/img/common/icon/widget-icon-writer.png') left/contain no-repeat;
position: relative;
bottom: 2px
}
#main-contents [id^=sidebar-] {
border: 0
}
#main-contents #sidebar-new-3 h3 {
color: #FFF;
background: url('https://oripalette.jp/media/img/common/top/h2-wbg-r.png') right center no-repeat, url('https://oripalette.jp/media/img/common/top/h2-wbg-l.png') left center no-repeat #f7568a;
background-size: 20px;
font-size: 18px;
font-weight: 700;
padding: 8px 10px;
margin-bottom: 25px;
text-align: center
}
#main-contents #sidebar-new-3 h3:before {
content: '';
display: inline-block;
width: 26px;
height: 18px;
vertical-align: middle;
background: url('https://oripalette.jp/media/img/common/icon/widget-icon-list.png') left/contain no-repeat;
position: relative;
bottom: 1px
}
#sidebar-new-3 ul.ri-app-list li {
width: 24%;
line-height: 1
}
#sidebar-new-3 ul.ri-app-list li a {
padding-bottom: 10px
}
#sidebar-new-3 ul.ri-app-list li img {
width: 78px
}
body #footer {
background: url('https://oripalette.jp/media/img/common/top/shindan-monobg-2.png') #FFF;
margin: 0;
padding: 20px 0 10px;
color: #333;
border-top: 1px solid #d8d8d8
}
.footLogo {
margin: 0 auto 10px;
display: block;
width: 100%;
position: relative
}
.footLogo img {
width: 60%;
display: block;
text-align: center;
margin: 0 auto
}
.area01-freebox {
float: none;
width: 95%;
padding: 10px;
background: 0 0;
border: 1px solid #d8d8d8;
display: block;
margin: 0 auto;
border-radius: 5px
}
body #footer .area02 {
box-sizing: border-box;
width: 100%;
padding: 0 10px;
margin: 0 0 40px;
float: none
}
body #footer .area01 {
float: none;
width: 100%;
padding: 0;
margin: 0;
position: relative;
display: inline-block
}
#footer .sitelink-f {
float: none;
width: 100%;
padding: 0 10px
}
#footer .sitelink-f ul {
display: flex;
justify-content: left;
align-items: center;
-webkit-flex-wrap: wrap;
flex-wrap: wrap
}
#footer .sitelink-f li {
width: auto;
margin: 0 30px 0 5px;
font-size: 12px
}
#footer .sitelink-f li a {
display: block;
padding: 0;
position: relative;
margin-top: 5px;
margin-bottom: 5px;
color: #0c749b
}
#footer .footer-menu {
margin: 0 0 20px
}
#footer .footer-menu h3 {
width: 100%;
display: block;
background: 0 0;
border-bottom: 1px solid #2299f2;
margin: 10px 0;
padding: 0 0 5px;
line-height: normal
}
body .copyright {
line-height: normal
}
.copyright span {
display: block
}
#footer-in .menu-footer2-container li {
margin: 4px;
padding: 0
}
#footer-in .menu-footer2-container li a {
background: #9c9c9c;
padding: 5px 10px;
border-radius: 50px;
color: #FFF
}
#footer .sitelink-f li a::after,
#footer .sitelink-f li a::before {
display: none
}
/*body .footer-navi-wrap {
display: block;
position: fixed;
bottom: 0;
z-index: 5;
animation: fadeIn 3s ease 0s 1 normal;
-webkit-animation: fadeIn 3s ease 0s 1 normal;
opacity: .9;
width: 100%;
left: 0;
}*/
@keyframes fadeIn {
0% {
opacity: 0
}
100% {
opacity: .9
}
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0
}
100% {
opacity: .9
}
}
body .footer-navi-wrap ul {
display: flex;
justify-content: center;
align-items: center
}
body .footer-navi-wrap ul li {
display: block;
width: 100%;
line-height: normal;
font-size: 11px;
background: #353130;
text-align: center;
color: #FFF;
position: relative;
margin: 0!important;
}
body .footer-navi-wrap ul li.f-navi-rank{
display:none;
}

body .footer-navi-wrap ul li a,
body .footer-navi-wrap ul li span {
color: #FFF;
display: block;
width: 100%;
height: 100%;
padding: 20px 0 0;
line-height: 40px
}
body .footer-navi-wrap ul li.f-navi-home a:before,
body .footer-navi-wrap ul li.f-navi-mokuji a:before,
body .footer-navi-wrap ul li.f-navi-search span:before {
width: 15px;
height: 15px;
right: 0;
left: 0;
top: 13px;
margin: auto;
position: absolute;
display: block;
text-align: center;
line-height: normal;
content: ""
}
body .footer-navi-wrap ul li.f-navi-home a:before {
background: url('https://oripalette.jp/media/img/common/icon/sp-gfoot-home.png') center center/15px no-repeat
}
body .footer-navi-wrap ul li.f-navi-search span:before {
background: url('https://oripalette.jp/media/img/common/icon/sp-gfoot-search.png') center center/15px no-repeat
}
body .footer-navi-wrap ul li.f-navi-mokuji a:before {
background: url('https://oripalette.jp/media/img/common/icon/sp-gfoot-mokuji.png') center center/15px no-repeat;
color: #fe7199
}
body .footer-navi-wrap ul li.f-navi-ptop a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/sp-gfoot-top.png') center center/16px no-repeat;
width: 16px;
height: 16px;
right: 0;
left: 0;
top: 13px;
margin: auto;
position: absolute;
display: block;
text-align: center;
line-height: normal
}
body .footer-navi-wrap ul li.f-navi-rank a:before,
body .footer-navi-wrap ul li.f-navi-shindan a:before {
content: "";
width: 15px;
height: 15px;
right: 0;
left: 0;
top: 13px;
margin: auto;
position: absolute;
display: block;
line-height: normal;
text-align: center
}
body .footer-navi-wrap ul li.f-navi-rank a:before {
background: url('https://oripalette.jp/media/img/common/icon/sp-gfoot-rank.png') center center/13px no-repeat
}
body .footer-navi-wrap ul li.f-navi-shindan a:before {
background: url('https://oripalette.jp/media/img/common/icon/sp-gfoot-shindan.png') center center/14px no-repeat
}
.footerBtn {
display: none
}
body .top-main-box {
width: 100%;
height: auto;
margin: 0 auto;
overflow: hidden;
padding-bottom: 30px
}
body #main-contents .top-main-box+p {
margin: 0;
padding: 0;
line-height: normal
}
body .top-main-box .shindan-midashi {
position: relative;
z-index: 2;
text-align: center;
background: rgba(0, 0, 0, .85);
padding: 20px 0;
margin: 0;
display: flex;
justify-content: center;
align-items: center
}
body .top-main-box .shindan-midashi img {
width: 72%
}
body .top-main-box .shindan-midashi:after,
body .top-main-box .shindan-midashi:before {
content: "";
position: absolute;
width: 100%;
height: 50px;
top: 0;
bottom: 0;
margin: auto;
opacity: .5
}
body .top-main-box .shindan-midashi:before {
background: url('https://oripalette.jp/media/img/common/top/shindan-icon-l.png') right/100% repeat-x;
left: -89%
}
body .top-main-box .shindan-midashi:after {
background: url('https://oripalette.jp/media/img/common/top/shindan-icon-r.png') left/100% repeat-x;
left: 89%
}
body .top-main-box .select-box {
width: 90%;
padding: 20px 0 0;
height: 220px
}
body .top-main-box .select-box:before {
background-position: top;
width: 86px;
height: 160px;
top: 125px;
left: -15px
}
body .top-main-box .select-box:after {
background-position: top;
width: 62px;
height: 160px;
top: 137px;
right: 5px
}
body .top-main-box .select-1 {
position: relative
}
body .top-main-box .select-1 select {
width: 86%;
height: 40px;
padding: 0 12px;
font-size: 12px;
border: 1px solid #dedede;
background: #FFF;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
body .top-main-box .select-2-3 {
margin: 15px 0;
position: relative
}
.top-main-box .select-2-3:before,
body .top-main-box .select-1:after,
body .top-main-box .select-2-3:after {
content: '▼';
display: inline-block;
color: #f8558a;
position: absolute;
top: 10px;
margin: auto;
font-size: 12px;
bottom: 0
}
body .top-main-box .select-2-3 select {
width: 42%;
height: 40px;
padding: 0 12px;
font-size: 12px;
border: 1px solid #dedede;
background: #FFF;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
body .top-main-box .select-1:after,
body .top-main-box .select-2-3:after {
right: 45px
}
.top-main-box .select-2-3:before {
right: 50px;
left: 0
}
body .top-main-box .select-box button {
line-height: 44px;
width: 54%;
font-size: 18px;
letter-spacing: 2px
}
body .top-main-box .select-box a.top-icon-huwa-1 {
top: 150px;
left: -16px
}
body .top-main-box .select-box a.top-icon-huwa-2 {
top: 180px;
right: -3px
}
body .top-main-box .select-box a.top-icon-huwa-1 img {
width: 34px
}
body .top-main-box .select-box a.top-icon-huwa-2 img {
width: 30px
}
#main-contents .osusume-app-ranking-wrap {
background: #efefef;
padding: 20px 0
}
#main-contents .osusume-app-ranking-wrap .btn-link-box {
background: rgba(41, 154, 235, 1);
background: -moz-linear-gradient(left,rgba(41,154,235,1) 0,rgba(239,85,137,1) 100%);
background: -webkit-gradient(left top,right top,color-stop(0,rgba(41,154,235,1)),color-stop(100%,rgba(239,85,137,1)));
background: -webkit-linear-gradient(left,rgba(41,154,235,1) 0,rgba(239,85,137,1) 100%);
background: -o-linear-gradient(left,rgba(41,154,235,1) 0,rgba(239,85,137,1) 100%);
background: -ms-linear-gradient(left,rgba(41,154,235,1) 0,rgba(239,85,137,1) 100%);
background: linear-gradient(to right,rgba(41,154,235,1) 0,rgba(239,85,137,1) 100%);
border-radius: 30px;
padding: 5px;
width: 90%;
margin: 0 auto 15px
}
#main-contents .osusume-app-ranking-wrap .btn-link-box a {
display: block;
background-color: #fff;
border-radius: 30px;
line-height: 45px;
text-align: center;
font-size: 16px;
font-weight: 700;
color: #2194ef;
position: relative;
box-shadow: 0 0 3px 0 #7b7dc2
}
#main-contents .osusume-app-ranking-wrap .btn-link-box a:before {
content: '';
background: url('https://oripalette.jp/media/img/common/icon/top-bt-crown.png') 0 0/100% no-repeat;
width: 20px;
height: 20px;
top: 1px;
bottom: 0;
left: 10px;
position: absolute;
margin: auto
}
#main-contents .osusume-app-ranking-wrap .btn-link-box a:after {
content: '＞';
display: inline-block;
color: #f8558a;
position: absolute;
right: 15px;
top: 0;
bottom: 0;
margin: auto
}
#main-contents .osusume-app-ranking-wrap .text-link-box {
text-align: center;
display: block;
margin-bottom: 0
}
#main-contents .osusume-app-ranking-wrap .text-link-box a {
color: #f65689;
font-weight: 700;
font-size: 14px;
position: relative
}
#main-contents .osusume-app-ranking-wrap .text-link-box a:before {
content: '';
background: url('https://oripalette.jp/media/img/common/icon/top-bt-other.png') no-repeat;
background-size: 100%;
width: 16px;
height: 16px;
position: absolute;
top: 0;
bottom: 0;
left: -23px;
z-index: 1;
margin: auto
}
.ninki-ranking dt {
width: 30%
}
#main-contents .ninki-ranking dd {
width: 66%;
padding-left: 3px;
margin: 0
}
.ninki-ranking dd a {
font-size: 12px
}
#main-contents .top-newlist-wappa {
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 0 10px
}
#main-contents section.ninkirank-box {
margin: 10px 0;
text-align: center
}
#main-contents section.ninkirank-box h2 {
color: #FFF;
background: url('https://oripalette.jp/media/img/common/top/h2-bg-r.png') right center/20px no-repeat, url('https://oripalette.jp/media/img/common/top/h2-bg-l.png') left center/20px no-repeat #333;
font-size: 18px;
font-weight: 700;
padding: 8px 10px;
margin-bottom: 10px;
text-align: center
}
#main-contents section.ninkirank-box article {
display: inline-block;
border: 1px solid #e2e2e2;
width: 48.5%;
margin: 0 0 10px;
position: relative;
padding: 0;
vertical-align: top;
border-radius: 10px
}
#main-contents section.ninkirank-box article:nth-of-type(2n) {
margin-left: 0
}
#main-contents div.ninkirank-list-main {
height: 100px;
text-align: left
}
.ninkirank-list1 {
margin: 0
}
.ninkirank-list1 br {
display: none
}
#main-contents .ninkirank-list1 a {
padding: 0 5px;
font-size: 11px;
line-height: 23px;
border-radius: 0 10px 0 0;
background: rgba(51, 51, 51, .6)
}
#main-contents .ninkirank-list1 a:nth-of-type(2) {
top: 25px;
border-radius: 0;
background: rgba(51, 51, 51, .6)
}
#main-contents section a.allBtn2 {
text-align: center;
display: block;
margin: 20px auto;
background: rgba(48, 165, 242, 1);
background: -moz-linear-gradient(left,rgba(48,165,242,1) 0,rgba(34,149,237,1) 100%);
background: -webkit-gradient(left top,right top,color-stop(0,rgba(48,165,242,1)),color-stop(100%,rgba(34,149,237,1)));
background: -webkit-linear-gradient(left,rgba(48,165,242,1) 0,rgba(34,149,237,1) 100%);
background: -o-linear-gradient(left,rgba(48,165,242,1) 0,rgba(34,149,237,1) 100%);
background: -ms-linear-gradient(left,rgba(48,165,242,1) 0,rgba(34,149,237,1) 100%);
background: linear-gradient(to right,rgba(48,165,242,1) 0,rgba(34,149,237,1) 100%);
padding: 5px 0;
line-height: 30px;
width: 95%;
border-radius: 30px;
color: #FFF;
box-shadow: 0 2px 0 1px #0070bc
}
#main-contents section.ninkirank-box article a img {
width: 100%;
height: auto;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: 0;
vertical-align: middle;
object-fit: contain;
object-position: center;
border-bottom: 1px solid #e2e2e2;
border-radius: 10px 10px 0 0
}
#main-contents section.ninkirank-box article p {
display: inline-block;
padding: 0;
margin: 0;
font-size: 12px;
font-weight: 700;
width: auto;
line-height: 1.4
}
#main-contents section.ninkirank-box article span {
display: none
}
#main-contents section.chumokuapp-box h2 {
color: #FFF;
background: url('https://oripalette.jp/media/img/common/top/h2-bg-r.png') right center no-repeat, url('https://oripalette.jp/media/img/common/top/h2-bg-l.png') left center no-repeat #333;
font-size: 18px;
font-weight: 700;
padding: 8px 10px;
margin-bottom: 10px;
text-align: center
}
#main-contents section.chumokuapp-box h3 {
background: url('https://oripalette.jp/media/img/common/top/ranking-icon-koi.png') left center/32px no-repeat;
color: #050d41;
font-size: 16px;
margin: 0 auto;
padding: 0 0 0 45px;
width: auto;
line-height: 50px;
display: table;
font-weight: 700
}
#main-contents section.chumokuapp-box h3:nth-of-type(2) {
background: url('https://oripalette.jp/media/img/common/top/ranking-icon-kon.png') left center/32px no-repeat
}
#main-contents section.chumokuapp-box h3:nth-of-type(3) {
background: url('https://oripalette.jp/media/img/common/top/ranking-icon-date.png') left center/32px no-repeat
}
#main-contents section.chumokuapp-box .top-chumokuapp-wappa {
width: 100%;
display: flex;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
background: #efefef;
padding: 10px 0;
border-top: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5
}
.scroll-area-top {
display: flex;
width: 100%;
min-width: max-content;
flex-wrap: wrap;
-webkit-flex-wrap: wrap
}
#main-contents section.chumokuapp-box .scroll-area-top article {
border: 1px solid #e2e2e2;
background: #FFF;
width: 250px;
margin: 0 0 0 10px;
display: inline-block;
position: relative;
padding: 0
}
#main-contents section.chumokuapp-box .scroll-area-top article:last-of-type {
margin: 0 10px
}
#main-contents section.chumokuapp-box .scroll-area-top article a:before {
content: '';
position: absolute;
z-index: 2;
display: inline-block;
width: 40px;
height: 40px;
top: -1px;
left: -1px;
background: url('https://oripalette.jp/media/img/common/icon/app-no1-icon.png') no-repeat;
background-size: contain
}
#main-contents section.chumokuapp-box .scroll-area-top article:nth-child(2) a:before {
background-image: url('https://oripalette.jp/media/img/common/icon/app-no2-icon.png')
}
#main-contents section.chumokuapp-box .scroll-area-top article:nth-child(3) a:before {
background-image: url('https://oripalette.jp/media/img/common/icon/app-no3-icon.png')
}
#main-contents section.chumokuapp-box .scroll-area-top article img {
width: 100%;
height: auto;
display: inline-block;
vertical-align: middle;
border: 0 solid #FFF;
padding: 0;
margin-bottom: 10px
}
#main-contents section.chumokuapp-box .scroll-area-top article ul li {
display: inline-block;
margin: 0;
padding: 0
}
#main-contents section.chumokuapp-box .scroll-area-top article ul li a {
display: inline-block;
padding: 10px;
margin: 0 5px;
background: #ccc;
font-size: 12px;
color: #FFF;
font-weight: 700
}
#main-contents section.chumokuapp-box .scroll-area-top article ul li a:hover {
display: inline-block;
padding: 10px;
margin: 0 5px;
background: #676767;
font-size: 12px
}
#main-contents section.chumokuapp-box .scroll-area-top article p {
display: inline-block;
padding: 5px;
margin: 0;
font-size: 12px;
color: #676767;
font-weight: 700;
width: 100%;
height: auto;
vertical-align: middle
}
#main-contents section.chumokuapp-box .scroll-area-top p:empty {
display: none
}
#main-contents section.chumokuapp-box .scroll-area-top article p a,
#main-contents section.chumokuapp-box .scroll-area-top article p br {
display: block
}
#main-contents section.chumokuapp-box .scroll-area-top article span {
display: none
}
#main-contents section.new2-box h2 {
color: #FFF;
background: url('https://oripalette.jp/media/img/common/top/h2-bg-r.png') right center/20px no-repeat, url('https://oripalette.jp/media/img/common/top/h2-bg-l.png') left center/20px no-repeat #333;
font-size: 18px;
font-weight: 700;
padding: 8px 0;
margin: 0 0 10px;
text-align: center
}
#main-contents section.new2-box .top-new2-wappa {
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 0 10px
}
#main-contents section.new2-box article {
border: 1px solid #e2e2e2;
background: #FFF;
width: 48.5%;
margin: 0 0 10px;
display: inline-block;
position: relative;
border-radius: 10px;
overflow: hidden;
min-height: 185px;
vertical-align: top;
text-align: left
}
#main-contents section.new2-box article ul,
#main-contents section.new2-box article ul li {
padding: 0;
margin: 0;
line-height: 0
}
#main-contents section.new2-box article ul li a {
position: absolute;
display: inline-block;
top: 0;
right: -5px;
background: rgba(51, 51, 51, .6);
width: auto;
font-size: 11px;
line-height: 23px;
border-radius: 0 10px 0 0
}
#main-contents section.new2-box article ul li:nth-child(2) a {
top: 25px;
border-radius: 0
}
#main-contents section.new2-box article img {
width: 100%;
height: auto;
max-height: 80px;
height: 80px;
position: relative;
object-fit: cover;
top: -1px;
left: 0;
right: 0;
bottom: 0;
margin: auto;
border-radius: 10px 10px 0 0;
border-bottom: 1px solid #e2e2e2;
box-sizing: border-box;
object-position: top
}
#main-contents section.new2-box article ul li a {
padding: 0 10px;
margin: 0 5px;
color: #FFF;
font-weight: 700
}
#main-contents section.new2-box article p {
display: inline-block;
padding: 5px;
margin: 0 0 5px;
font-size: 12px;
font-weight: 700;
line-height: 1.4
}
#main-contents section.new2-box article span {
display: inline-block;
padding: 5px;
position: absolute;
bottom: 0;
right: 3px;
font-size: 12px;
color: #999
}
#main-contents .post {
border-top: 0;
padding: 0 10px;
box-sizing: border-box
}
article.post + .contents{
padding:0 10px!important;
}
#main-contents .post h1 {
margin: 10px 0;
line-height: normal;
font-size: 22px;
font-weight: 700
}
#main-contents .post-meta02 {
padding: 0 5px;
background: #FFF;
margin: 0
}
#main-contents table {
width: 100%;
margin-bottom: 1.5em;
padding: 0;
border: 1px solid #dde4e6
}
#main-contents td,
#main-contents th {
padding: 0.5em;
border-right: 1px solid #dde4e6;
border-bottom: 1px solid #dde4e6;
font-size: 12px
}
#main-contents th {
background-color: #f0f0f0;
font-weight: 700;
text-align: left
}
#main-contents dd {
margin: 5px 0
}
span.post-data {
color: #999;
display: inline;
font-size:12px;
padding-left:2px
}
.post .contents {
margin: 10px 0;
padding: 10px 0
}
.kasouTitle {
display: none
}
.article {
width: 100%
}
.article p {
word-break: break-all
}
.article p.lead {
margin: 0 5px
}
#main-in .tableLine tr:nth-child(odd),
#main-in .tableLineEven tr:nth-child(even) {
background: #FCFCFC
}
#main-contents .snsBox01 {
margin: 0 auto;
width: 82%;
float: none
}
.snsBox02 {
position: absolute;
right: 0;
bottom: 5px;
display: flex;
flex-wrap: wrap;
justify-content: space-between
}
.snsBox02 li {
display: inline-block;
position: relative;
height: 20px;
box-sizing: border-box;
padding: 0;
border-radius: 0;
cursor: pointer;
font-size: 11px;
text-align: center;
vertical-align: middle;
margin:0 2px;
border-radius:50px;
}
.snsBox02 li a {
display: -webkit-flex;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 20px;
line-height: 20px;
}
.sns-button02:last-of-type .snsBox02 {
position: static;
display: inline-block
}
#main-contents .snsBox02 li {
padding: 0;
margin: 0 8px 0 0;
border-radius: 50px;
width: 50px;
height: 20px;
line-height: 20px
}
#main-contents .sns-button02:last-of-type .snsBox02 li {
margin: 0 4px 0 0
}
.snsBox02 .line-icon img,
.snsBox02 .twi-icon img,
.snsBox02 li.facebook-icon img {
width: 14px;
}
.snsBox02 .hate-icon img {
width: 14px;
}
div.shortcode-chart-purpose {
width: 100%;
height: auto;
padding: 10px 0 5px;
border: 1px solid #e5e5e5;
box-sizing: border-box;
margin: 0 0 20px
}
div.shortcode-chart-purpose div.purpose-area {
width: 47%;
margin-left: 5px
}
#main-contents p.purpose-data {
margin-bottom: 3px;
line-height: 1.5em;
font-size: 14px;
padding: 5px 0 5px 20px;
background-position: 24% center;
background-size: 15px
}
.post div.shortcode-chart-gender {
width: 100%;
height: auto;
margin-bottom: 20px
}
#main-contents p.gender-age-head {
margin: 0 0 0 2px;
font-size: 11px
}
div.gender-age-graph {
margin: 0
}
#main-contents p.bar,
#main-contents span.bar {
height: 15px
}
.gender-age-graph span.gender-age-data.female,
.gender-age-graph span.gender-age-data.male {
width: 32px;
height: auto;
line-height: normal;
font-size: 11px;
padding: 3px 0;
position: absolute;
right: 15px
}
div.shortcode-chart-gender div.chart-area,
div.shortcode-chart-purpose div.chart-area {
width: 50%;
height: auto
}
div.shortcode-chart-gender div.gender-age-area {
box-sizing: border-box;
width: 47%;
height: auto;
margin: 0 0 0 5px;
padding: 8px 8px 15px;
border: 2px solid #ccc
}
div.article div.shortcode-purpose-tree {
width: 100%;
height: auto;
margin: 0 0 20px
}
#main-contents .shortcode-purpose-tree li.tree-child {
padding: 23px 3px 0
}
#main-contents ul.purpose-tree.child {
margin-top: 10px
}
#main-contents .shortcode-purpose-tree li.tree-child p {
width: 50px;
font-size: 100%;
height: 24px;
margin-bottom: 10px
}
span.rec-star {
font-size: 100%
}
span.rec-star img {
width: 15px;
margin: 0 0 0 3px;
position: relative;
bottom: 1px
}
#main-contents li.tree-parent {
padding-left: 0
}
#main-contents .commentlist {
padding: 10px
}
#main-contents h2 {
        background-size: 100%;
        background-color: #f05656;
        line-height: normal;
        border-bottom: solid 3px #c20000;
        color: #fff;
        font-size: 19px;
        margin: 0 0 10px;
        text-align: left;
        padding: 9px 0 4px 12px;
        font-weight: bold;
       /* border-top-left-radius: 20px; */
        /* border-top-right-radius: 20px; */
}
#main-contents h3 {
font-size: 15px;
margin: 0 0 20px;
text-align: left;
padding: 5px 10px 5px 15px;
font-weight: 700;
border-bottom: 2px solid #3a3168;
position:relative;
line-height:normal;
}
#main-contents h3:before{
content:"";
position:absolute;
background-color: #fea9cd;
/*background:url(https://oripalette.jp/media/img/common/design/h3_bg.jpg)no-repeat center center;*/
background-size:100% 100%;
width:10px;
height:100%;
top:0;
bottom:-1px;
left:0;
margin:auto;
}
#main-contents h3#comment_title {
background:url(https://oripalette.jp/media/img/common/design/h3-bg.svg)no-repeat center left;
background-size:auto;
font-size: 15px;
margin: 0 0 20px;
text-align: left;
padding: 0 10px 0 15px;
font-weight: 700;
border-bottom: 2px solid #3a3168;
border-left:0;
}
#main-contents h3.kuchi-icon {
background: url('https://oripalette.jp/media/img/media/uploads/2019/02/2019y02m15d_1218516666.png') left/25px no-repeat;
padding: 2px 0 2px 30px;
font-size: 15px;
margin: 10px 0 5px;
border: none
}
#main-contents h4 {
padding: 5px 0;
font-size: 15px;
margin: 10px 0 15px;
font-weight: 700;
line-height: normal;
background: #f2f2f2;
display: flex;
align-items: center;
border-radius:3px;
}
#main-contents h4:before {
content: "";
width: 5px;
height: 25px;
background: #ff2e47;
display: inline-block;
margin: 0 8px;
border-radius: 50px
}
#main-contents h4.kuchi-icon:before,
.mokujiInfo_ac ul:nth-of-type(2) {
display: none
}
#main-contents h4.kuchi-icon {
background: url('https://oripalette.jp/media/img/media/uploads/2019/02/2019y02m15d_1218516666.png') left/25px no-repeat #FFF;
padding: 2px 0 2px 30px;
font-size: 15px;
margin: 10px 0 5px;
border: none;
box-sizing: border-box
}
.editors_box {
padding: 12px
}
.editors_box div {
margin-bottom: 0px;
    display: flex;
    align-items: center;
}
.editors_box div > span {
margin-right: 5px
}
.editors_box div > span span {
font-size: 12px;
width: 150px;
left: -5px;
top: -32px;
line-height: 28px
}
.editors_box div>span span:after {
border-width:10px 18px 0 0px;
left: 63px;
top: 27px
}
.editors_box div p {
background: #FFF;
padding-bottom: 3px;
margin-bottom: 10px!important;
}
.editors_box div p span {
font-size: 14px
}
#main-contents .editors_box > p,.editors_box > p {
font-size: 12px
}
#main-contents .editors_box.editors_point p{
font-size:14px;
}
#main-contents .mokujiInfo_ac .mokujiTitle {
margin: 0;
padding: 0 0 0 10px
}
#main-contents .mokujiInfo_ac ul {
margin: 0
}
#main-contents .mokujiInfo_ac ul li {
font-size: 14px;
background: 0 0;
padding: 0 3px 0 12px;
line-height: 2;
margin: 0
}
.mokujiInfo {
background: #f5f5f5;
border: 1px solid #dde4e6;
margin-bottom: 20px;
padding: 5px
}
.mokujiInfo ul {
margin: -10px 10px 12px 0
}
.contents .mokujiInfo h2,
.contents .mokujiInfo p.mokujiTitle {
background: 0 0;
font-size: 110%;
margin: 0 0 10px
}
.mokujiInfo ul li {
font-size: 14px;
background: 0 0;
border-bottom: 0;
padding: 0 3px 7px 14px
}
.mokujiInfo h2,
.mokujiInfo p.mokujiTitle {
background: rgba(0, 0, 0, 0);
border: none;
color: #333;
font-size: 110%;
font-weight: 700;
margin-top: 0
}
.mokujiInfo_ac {
background: #f5f5f5;
border: 1px solid #dde4e6;
margin-bottom: 20px;
padding: 5px
}
.mokujiInfo_ac .mokujiTitle {
color: #333;
font-size: 110%;
font-weight: 700;
padding: 8px 0 8px 12px;
margin: 0
}
.mokuji_acbtn {
line-height: 1.8;
background: #ccc;
cursor: pointer;
border: 1px solid #f7f7f7;
text-align: center;
margin: 0 10px 5px
}
.mokuji_acbtn:hover {
opacity: .6
}
.mokuji_acbtn:before {
content: '▼';
color: #fff
}
.mokuji_acbtn.mokuji_active:before {
content: '▲'
}
#mainCenter .post .mokujiInfo_ac ul {
margin: 0
}
#mainCenter .post .mokujiInfo_ac ul li {
font-size: 14px;
background: 0 0;
padding: 0 3px 0 17px;
line-height: 2.2;
margin: 0
}
#main-contents .kanrenlist-box {
background-color: #f0f9ff;
height: auto;
border: 1px solid #c6e7ff;
border-radius: 5px;
padding: 0 5px 10px;
margin-bottom: 20px;
display: block
}
#main-contents .post .kanrenlist-box li:first-child {
font-size: 14px;
font-weight: 700;
display: block;
padding: 10px 10px 5px;
background-color: #f0f9ff;
margin: 0
}
#main-contents .post .kanrenlist-box li {
font-size: 12px;
font-weight: 700;
display: block;
padding: 3px 10px;
background-color: #f0f9ff;
margin: 0;
line-height: normal
}
body #main-contents table.voiceBox,
body #main-contents table.voiceBox2 {
margin-bottom: 20px;
position: relative;
z-index: 1
}
body #main-contents table.voiceBox,
body #main-contents table.voiceBox td,
body #mainCenter table.voiceBox th {
border: none
}
body #main-contents table.voiceBox td,
body #main-contents table.voiceBox2 td {
vertical-align: top
}
body #main-contents table.voiceBox td:first-child {
padding: 0 0 0 10px;
margin: 0;
width: 70px
}
body #main-contents table.voiceBox td:nth-of-type(2) {
padding: 0 20px
}
body #main-contents table.voiceBox td:first-child img,
body #main-contents table.voiceBox2 td:first-child img {
display: block;
width: 60px;
margin: 0 auto;
text-align: center;
border-radius: 3px
}
body #main-contents table.voiceBox td:first-child img[src*="2018y11m28d_2024434391.png"] {
width: 60px;
height: 60px;
object-fit: contain;
object-position: center 5px;
margin: 0 auto;
text-align: center;
-webkit-filter:drop-shadow(-2px 2px 0 #fffcf);
border-radius: 50%;
border: 2px solid #ccc
}
body #main-contents table.voiceBox td:first-child img[src*="2018y11m28d_2024444835.png"] {
width: 60px;
height: 60px;
padding: 4px 2px 0;
object-fit: contain;
object-position: center 5px;
margin: 0 auto;
text-align: center;
-webkit-filter:drop-shadow(-2px 2px 0 #fffcf);
border-radius: 50%;
border: 2px solid #ccc
}
body #main-contents table.voiceBox td:nth-child(2) p::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
left: -10px;
top: 7px;
border: 10px solid transparent;
border-top-color: #ddd;
z-index: -1
}
body #main-contents table.voiceBox td:nth-child(2) p::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
left: -8px;
top: 8px;
border: 9px solid transparent;
border-top-color: #fff;
z-index: 2
}
body #main-contents table.voiceBox td:nth-child(2) p,
body #main-contents table.voiceBox2 td:nth-child(2) p {
background: #fff;
padding: 10px;
position: relative;
border: 1px solid #ddd;
border-radius: 2px;
line-height: normal;
font-size: 13px;
margin-bottom: 0;
box-shadow: 1px 1px 2px 0 #e4e4e4
}
body #main-contents table.voiceBox2,
body #mainCenter table.voiceBox2 td,
body #mainCenter table.voiceBox2 th {
border: none
}
body #main-contents table.voiceBox2 tr {
display: flex;
flex-flow: row nowrap
}
body #main-contents table.voiceBox2 td:first-child {
padding: 0 10px 0 0;
margin: 0;
width: 100px;
order: 2;
border: none
}
body #main-contents table.voiceBox2 td:nth-of-type(2) {
padding: 0 20px 0 10px;
order: 1;
width: 100%;
border: none
}
body #main-contents table.voiceBox2 td:first-child span {
font-size: 13px
}
body #main-contents table.voiceBox2 td:nth-child(2) p::before {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
right: -10px;
top: 7px;
border: 10px solid transparent;
border-top-color: #ddd;
z-index: -1
}
body #main-contents table.voiceBox2 td:nth-child(2) p::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
right: -8px;
top: 8px;
border: 9px solid transparent;
border-top-color: #fff;
z-index: 2
}
.protxtBox1 dt,
.protxtBox2 dt,
.protxtBox3 dt,
.protxtBox4 dt {
font-size: 12px;
margin-bottom: 5px
}
.protxtBox1 dt p,
.protxtBox2 dt p,
.protxtBox3 dt p,
.protxtBox4 dt p {
margin-bottom: 5px
}
.protxtBox1 {
background-color: #fffbe1;
border: 1px solid #bababa;
border-radius: 10px;
color: #494949
}
.protxtBox1 dt span {
background: url('https://oripalette.jp/media/img/media/uploads/2018/10/2018y10m04d_202111515.png') left top/20px no-repeat;
font-size: 16px;
color: #282828;
padding-left: 30px
}
.protxtBox2 {
background-color: #fffbe1;
border: 1px solid #bababa;
border-radius: 10px;
color: #494949;
padding: 10px
}
.protxtBox2 dt span {
background: url('https://oripalette.jp/media/img/media/uploads/2018/10/2018y10m04d_2021097234.png') left top/20px no-repeat;
font-size: 16px;
color: #282828;
padding-left: 30px
}
#main-contents .post ul li.comeBoxM,
#main-contents .post ul li.comeBoxW {
margin-bottom: 20px;
display: inline-block;
width: 97%;
border-width: 1px;
border-style: dashed;
border-color: #ccc;
border-image: initial;
padding: 5px
}
#main-contents .post ul li.comeBoxM span img,
#main-contents .post ul li.comeBoxW span img {
text-align: center;
width: 50px;
height: 50px;
display: inline-block
}
#main-contents .post ul li.comeBoxM.Review-bad p,
#main-contents .post ul li.comeBoxM.Review-good p,
#main-contents .post ul li.comeBoxW.Review-bad p,
#main-contents .post ul li.comeBoxW.Review-good p {
font-size: 13px;
color: #494949;
display: inline-block;
padding: 5px;
margin-bottom: 0;
width: 74%
}
#main-contents .post ul li.comeBoxM p,
#main-contents .post ul li.comeBoxW p {
font-size: 13px;
color: #494949;
display: inline-block;
padding: 5px;
margin-bottom: 0;
width: 100%
}
#main-contents .post ul li.comeBoxM span,
#main-contents .post ul li.comeBoxW span {
width: 50px;
text-align: center;
display: inline-block;
vertical-align: top;
margin: 5px;
font-size: 10px;
font-weight: 700
}
#main-contents .post ul li.comeBoxM span {
color: #6cc
}
#main-contents .post ul li.comeBoxW span {
color: #ea4c89
}
#main-contents .post ul li.comeBoxM p.inyoumoto,
#main-contents .post ul li.comeBoxW p.inyoumoto {
text-align: right;
width: 96%;
color: #494949;
font-size: 10px;
margin: 0;
padding: 0
}
.conve-bt-boxs {
width: 95%;
padding: 10px 0 5px;
margin: 0 auto 20px
}
.conve-bt-boxs p.bt-download-txt {
margin: 0
}
.conve-bt-boxs p {
margin-bottom: 10px
}
.bt-download-txt a {
color: #de6000;
display: inline-block;
width: auto
}
.rank-ribbon-2,
.rank-ribbon-3 {
display: inline-block;
padding: 0 12px;
margin: 0;
line-height: 20px;
font-size: 14px;
letter-spacing: 0.1em;
color: #fff;
box-sizing: border-box
}
bon-1:before {
position: absolute;
content: '';
top: 0;
left: -3px;
border: none;
height: 28px;
width: 3px;
background: #fccd4d;
border-radius: 5px 0 0 5px
}
.rank-ribbon-1:after,
.rank-ribbon-2:before {
position: absolute;
content: '';
border: none
}
.rank-ribbon-1:after {
bottom: -7px;
left: -2px;
height: 7px;
width: 2px;
background: #f88400;
border-radius: 5px 0 0 5px
}
.rank-ribbon-2 {
position: absolute;
left: 0;
top: -5px;
height: 20px;
background: rgba(217, 242, 255, 1);
background: -moz-linear-gradient(-45deg,rgba(217,242,255,1) 0,rgba(104,149,173,1) 92%,rgba(104,149,173,1) 100%);
background: -webkit-gradient(left top,right bottom,color-stop(0,rgba(217,242,255,1)),color-stop(92%,rgba(104,149,173,1)),color-stop(100%,rgba(104,149,173,1)));
background: -webkit-linear-gradient(-45deg,rgba(217,242,255,1) 0,rgba(104,149,173,1) 92%,rgba(104,149,173,1) 100%);
background: -o-linear-gradient(-45deg,rgba(217,242,255,1) 0,rgba(104,149,173,1) 92%,rgba(104,149,173,1) 100%);
background: -ms-linear-gradient(-45deg,rgba(217,242,255,1) 0,rgba(104,149,173,1) 92%,rgba(104,149,173,1) 100%);
background: linear-gradient(135deg,rgba(217,242,255,1) 0,#6895ad 92%,rgba(104,149,173,1) 100%)
}
.rank-ribbon-2:before {
top: 0;
left: -3px;
height: 28px;
width: 3px;
background: #b1cddc;
border-radius: 5px 0 0 5px
}
.rank-ribbon-2:after,
.rank-ribbon-3:before {
border: none;
position: absolute;
content: ''
}
.rank-ribbon-2:after {
bottom: -7px;
left: -2px;
height: 7px;
width: 2px;
background: #667f8c;
border-radius: 5px 0 0 5px
}
.rank-ribbon-3 {
position: absolute;
left: 0;
top: -5px;
height: 20px;
background: rgba(255, 205, 130, 1);
background: -moz-linear-gradient(-45deg,rgba(255,205,130,1) 0,rgba(181,122,34,1) 100%);
background: -webkit-gradient(left top,right bottom,color-stop(0,rgba(255,205,130,1)),color-stop(100%,rgba(181,122,34,1)));
background: -webkit-linear-gradient(-45deg,rgba(255,205,130,1) 0,rgba(181,122,34,1) 100%);
background: -o-linear-gradient(-45deg,rgba(255,205,130,1) 0,rgba(181,122,34,1) 100%);
background: -ms-linear-gradient(-45deg,rgba(255,205,130,1) 0,rgba(181,122,34,1) 100%);
background: linear-gradient(135deg,rgba(255,205,130,1) 0,#b57a22 100%)
}
.rank-ribbon-3:before {
top: 0;
left: -3px;
height: 28px;
width: 3px;
background: #dcaf6d;
border-radius: 5px 0 0 5px
}
.rank-ribbon-3:after {
position: absolute;
content: '';
bottom: -7px;
left: -2px;
border: none;
height: 7px;
width: 2px;
background: #b57a22;
border-radius: 5px 0 0 5px
}
.modal_val {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
height: 130px
}
.modal_val form {
padding: 0;
margin: 0;
display: flex;
justify-content: center;
align-items: center
}
.modal_val form input[type=submit] {
width:35px;
height:35px;
margin:0;
border:0px solid #ccc;
border-left: 0;
cursor: pointer;
color: #444;
background: url('https://oripalette.jp/media/img/common/design/icon-search.svg') 50%/15px no-repeat #f3f3f3;
overflow: hidden;
text-indent: -9999px;
border-radius: 0;
border-radius:50px;
position:absolute;
right:15px;
}
.modal_val form input[type=text] {
height: 40px;
width: 75%;
padding: 0 50px 0 20px;
border: 0px solid #ccc;
background-color: #FFF;
font-size:16px;
border-radius:50px;
outline: none;
}
.modal_val form ::-webkit-input-placeholder {
color: #aaa
}
span#modal_close {
margin:20px auto;
display: block;
font-size: 16px;
color:#FFF;
border:1px solid #FFF;
width:50%;
}

.article form {
padding: 0;
margin: 0
}
.article form input[type=submit] {
height: 39px;
margin-left: -5px;
border: 2px solid #ccc
}
.article form input[type=text] {
height: 35px;
width: 60%;
padding: 0 0 0 10px;
border: 2px solid #ccc;
background-color: #FFF
}
.article form ::-webkit-input-placeholder {
color: #aaa
}
#main-contents .hyoubanbox03 dd {
font-weight: 700;
padding: 2px 5px;
margin: 0 5px;
font-size: 14px;
color: #676767
}
#main-contents .hyoubanbox03 dd:first-of-type{
margin-top: 10px;
}
#mainCenter .search-form_inputXX {
text-align: center;
margin-top: 30px
}
#mainCenter .search-form_inputXX #search-form-box_side {
padding: 4px 0 4px 6px;
width: 70%;
margin-left: 0
}
#mainCenter .search-form_inputXX .css-button {
width: 14%;
padding: 5px 0;
border: 1px solid #888;
background: #888;
color: #FFF;
cursor: pointer
}
#mainCenter .search-form_inputXX .css-button:hover {
background: #fb568e
}
#main-and-sub #main-contents .search-form_inputXX {
width: auto;
margin: 10px 0.5em 0;
font-size: 1.2em;
text-align: left
}
#main-and-sub #main-contents .search-form_inputXX #search-form-box_side {
margin-left: 3%;
width: 70%;
border: 1px solid #aaa;
height: 37px
}
#main-and-sub #main-contents .search-form_inputXX .css-button {
width: 20%;
padding: 5px 0;
border: 0;
background: #888;
color: #FFF;
text-indent: 0
}
#mainCenter #searchform .search-form_inputXX {
text-align: center;
margin-top: 0
}
#mainCenter #searchform .search-form_inputXX #search-form-box_side {
padding: 4px 0 4px 6px;
width: 70%;
margin-left: 0
}
#mainCenter #searchform .search-form_inputXX .css-button {
width: 14%;
padding: 5px 0;
border: 1px solid #888;
background: #888;
color: #FFF;
cursor: pointer
}
#searchform .search-form_inputXX .css-button:hover {
background: #fb568e
}
#main-and-sub #main-contents #searchform .search-form_inputXX {
width: auto;
margin: -40px 0.5em 1.5em;
font-size: 1.2em;
text-align: left
}
#main-and-sub #main-contents #searchform .search-form_inputXX #search-form-box_side {
margin-left: 3%;
padding: 4px 0 4px 6px;
width: 70%;
height: 29px
}
#main-and-sub #main-contents #searchform .search-form_inputXX .css-button {
width: 20%;
border: 1px solid #888
}
#sidebar .search-form_inputXX {
display: block;
margin: 15px 0 0;
border: none;
padding: 5px 0;
width: 100%;
text-align: center
}
#sidebar .search-form_inputXX form input[type=text] {
padding: 4px 0 4px 6px;
width: 70%
}
#sidebar .search-form_inputXX form input[type=submit] {
width: 20%;
padding: 5px 0;
border: 1px solid #888;
background: #888;
color: #FFF;
cursor: pointer
}
#sidebar .search-form_inputXX form input[type=submit]:hover {
background: #fb568e;
border: 1px solid #fb568e
}
#sidebar .search-form_inputXX ul {
width: 60%;
display: none;
height: 30px
}
#sidebar .search-form_inputXX ul li {
display: inline-block;
font-size: 15px;
font-weight: 700;
margin-right: 20px;
vertical-align: middle
}
a.ranking-inpage {
font-size: 13px;
width: 100%
}
.ranking-inpage:after,
.ranking-inpage:before {
width: 20px;
height: 20px
}
.twitter-tweet.twitter-tweet-rendered {
width: 95%
}
#main-contents .rank-list-osusume {
padding: 15px 10px 0
}
div.question-area span.question {
background-size: 150%;
padding: 7px 0 12px 30px
}
#main-contents .question-area {
height: auto;
min-height: auto
}
#main-contents .question-area p:empty {
margin: 0
}
#main-contents .answer-list li {
width: 90%;
background: #49b2ff;
color: #fff;
border-radius: 20px;
text-align: center;
position: relative;
padding: 0;
margin: 0 auto 10px
}
#main-contents .answer-list li:before {
content: '';
width: 24px;
height: 24px;
background: url('https://oripalette.jp/media/img/media/uploads/2019/08/2019y08m07d_1708041828.png') 0 0 /contain;
position: absolute;
top: 0;
bottom: 0;
left: 15px;
margin: auto
}
.result .result-area span {
font-size: 12px
}
.knren-card-wrap img.knren-card-img {
width: 30%
}
#main-contents .knren-card-wrap p.knren-card-p {
width: 70%;
font-size: 14px;
line-height: normal;
margin: 0 0 0 10px
}
.knren-card-wrap dl.knren-card-txt {
width: 65%;
margin: 0 0 0 10px;
padding: 0;
overflow: hidden
}
.knren-card-wrap dl.knren-card-txt dt {
margin: 0 0 5px;
padding: 0;
font-size: 13px;
line-height: 1.5;
font-weight: 700;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.knren-card-wrap dl.knren-card-txt dd {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
margin: 0;
padding: 0;
font-size: 10px;
line-height: 1.4
}
#main-contents .osusume-app-table {
border: 1px solid #ccc
}
#main-contents .osusume-app-table th {
background: #ffe3a4;
text-align: center;
border: 1px solid #ccc
}
#main-contents .osusume-app-table th:nth-of-type(1) {
width: 14%
}
#main-contents .osusume-app-table th:nth-of-type(2) {
width: 22%
}
#main-contents .osusume-app-table td {
border: 1px solid #ccc;
padding: 3px 2px 5px
}
#main-contents .osusume-app-table .rank {
font-size: 20px;
font-weight: 700;
padding: 5px;
color: #666;
text-align: center;
line-height: 16px
}
#main-contents .osusume-app-table .rank img {
display: block;
width: 20px;
height: 14px;
margin: 0 auto 4px
}
#main-contents .osusume-app-table .icon {
text-align: center;
font-weight: 700;
font-size: 10px;
line-height: 15px
}
#main-contents .osusume-app-table .icon img:first-of-type {
width: 40px;
height: 40px;
display: block;
margin: 0 auto 2px
}
#main-contents .osusume-app-table .tokucho {
border-bottom: 0;
padding-bottom: 0;
font-weight: 700;
font-size: 12px
}
#main-contents .osusume-app-table .ryoukin {
border-top: 0;
border-right: 0;
padding-right: 0;
vertical-align: top
}
#main-contents .osusume-app-table .ryoukin span {
display: block
}
#main-contents .osusume-app-table .ryoukin span:first-of-type:before {
content: '男';
width: 20px;
height: 20px;
background: #2299f2;
color: #fff;
display: inline-block;
border-radius: 50%;
text-align: center;
line-height: 20px;
margin: 0 2px 5px 0
}
#main-contents .osusume-app-table .ryoukin span:last-of-type:before {
content: '女';
width: 20px;
height: 20px;
background: #fb568e;
color: #fff;
display: inline-block;
border-radius: 50%;
text-align: center;
line-height: 20px;
margin-right: 2px
}
#main-contents .osusume-app-table .tokucho-tag {
border-top: 0;
border-left: 0
}
#main-contents .osusume-app-table .tokucho-tag ul {
text-align: center;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: center;
align-items: center;
margin: 0
}
#main-contents .osusume-app-table .tokucho-tag li {
display: inline-block;
width: 30%;
margin: 0 2px 5px 0;
color: #777;
padding: 8px 0;
border: 1px solid #e6e6e6;
box-sizing: border-box;
border-radius: 5px;
background: #ededed;
text-align: center;
font-size: 11px
}
#main-contents .osusume-app-table .tokucho-tag li.checked {
background: #ff7c10;
color: #fff;
border: 1px solid #e6761a;
box-sizing: border-box
}
#categoryBox {
padding: 8px 5px
}
table.rank-list-appicon tr td:nth-child(2) a {
font-size: 11px;
line-height: 1.2
}
table.rank-list-appicon tr td:nth-child(2) img {
width: 50px;
margin-bottom: 2px
}
#categoryBox div.clearfix > p {
width: 70%;
font-size: 14px;
line-height: 1.4;
padding: 0 0 0 10px
}
#categoryBox div.clearfix > div {
width: 30% !important;
display: inline-block;
float: none
}
#categoryBox div.clearfix > div a,
#categoryBox div.clearfix > p a {
display: block;
font-size: 12px;
font-weight: 400
}
#categoryBox div.clearfix > div img {
max-width: none;
width: 100px
}
#categoryBox #categoryTitle02 {
margin: 5px 0 0;
line-height: normal;
font-size: 10px;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
#main-contents .article-pagenavi ul {
padding: 10px;
text-align: center
}
#main-contents .article-pagenavi ul li {
display: inline;
margin: 0 2px;
padding: 0
}
#main-contents .article-pagenavi ul li a,
#main-contents .article-pagenavi ul li span {
background: #3492cf;
border-radius: 4px;
color: #fff;
padding: 5px 10px;
margin: 0 2px
}
#main-contents .article-pagenavi ul li.current a {
background: 0 0;
padding: 5px 0;
margin: 0 2px
}
#main-contents .article-pagenavi ul li.current span {
border: 1px solid #3a7c9e;
background: #fff;
color: #3a7c9e
}
.footLogo:after {
display: none
}
body #footer .area02:after {
content: '';
display: block;
width: 100%;
height: 90px;
background: url('https://oripalette.jp/media/img/common/icon/icon-no1.png') center/contain no-repeat
}
body #footer .area02:before {
content: '※ 日本マーケティングリサーチ機構調べ 調査概要：2019年10月期_サイトのイメージ調査';
display: block;
width: 95%;
position: absolute;
bottom: -35px;
right: 0;
left: 0;
font-size: 10px;
color: #3b6287;
margin: auto;
line-height: normal
}
.footLogo:before {
display: none
}
.member-box {
border: 0
}
a.sakura-list-more-button {
width: 70%
}
#main-contents .sakura-list-table dd,
#main-contents .sakura-report-table dd,
#main-contents .sakura-search-table .app-icon-area,
#main-contents .sakura-search-table .search-area {
margin: 0
}
dl.sakura-report-table {
border-top: 0;
border-left: 0
}
dl.sakura-report-table dd.col1 {
border-left: 1px solid #ccc
}
#main-contents #sitemap_list li {
list-style: none;
padding: 15px 10px 15px 20px;
font-weight: 700;
background: #f7f4ff;
border: 1px solid #d6c7ff;
margin: 0 0 10px;
}
#main-contents #sitemap_list li ul {
margin-top: 10px;
margin-bottom: 0
}
#main-contents #sitemap_list li li {
padding: 15px 10px 0 15px;
line-height: 1.3em;
font-weight: 400;
background: 0 0;
border: 0 solid #ccc;
margin: 0;
position: relative;
font-size: 12px
}
#main-contents #sitemap_list li li::before {
position: absolute;
content: '';
width: 6px;
height: 6px;
border-top: solid 2px #9758f8;
border-right: solid 2px #9758f8;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
top: 22px;
left: 0;
margin-top: -3px
}
#main-contents #sitemap_list li a{
color: #a375ea;
}
#main-contents #sitemap_list li a:hover{
color: #9758f8;
}
#form-area input[type=text],
#form-area input[type=email],
#form-area textarea {
width: 100%;
box-sizing: border-box;
max-width: 100%
}
#main-contents #form-area li {
line-height: normal;
padding: 0
}
#form-control- .form-submit {
width: 50%;
background: #333;
color: #fff;
text-align: center;
border-radius: 4px;
padding: 7px 0 6px;
border: 0;
margin: 0 auto;
display: block;
cursor: pointer;
text-indent: 0
}
#main-contents #form-area p {
margin: 10px 0
}
.linemessage-box {
background: #7292c1;
padding: 10px;
margin: 0 0 20px
}
.linemessage-box p.linemessage-le,
.linemessage-box p.linemessage-ri {
display: block;
padding: 10px 20px;
width: 80%;
color: #555;
font-size: 14px;
line-height: 1.4;
box-sizing: border-box
}
.linemessage-box p.linemessage-ri {
background: #86e34a;
position: relative;
margin: 10px auto;
border: 0 solid #555;
border-radius: 30px
}
.linemessage-box p.linemessage-ri:before {
content: "";
position: absolute;
top: 20%;
right: -30px;
margin-top: 0;
border: 12px solid transparent;
border-left: 25px solid #86e34a;
z-index: 2
}
.linemessage-box p.linemessage-le {
background: #FFF;
position: relative;
margin: 10px auto;
border: 0 solid #555;
border-radius: 30px
}
.linemessage-box p.linemessage-le:before {
content: "";
position: absolute;
top: 20%;
left: -30px;
margin-top: 0;
border: 12px solid transparent;
border-right: 25px solid #FFF;
z-index: 2
}
.article .review-list-table .thead,
.article .review-post-table .thead,
.article .review-search-table .thead,
.sakura-report-table .thead,
.sakura-search-table .thead {
line-height: 34px;
box-sizing: border-box;
padding-left: 14px
}
dl.review-post-table .thead {
border-top: 0
}
#main-contents .review-post-table dd,
#main-contents .sakura-report-table dd {
margin: 0;
padding: 8px
}
.review-post-box .review-post-table .col1 {
width: 28%;
border-left: 0
}
#main-contents .sakura-report-table .col1 {
width: 28%
}
#main-contents .sakura-report-table .col2,
.review-post-box .review-post-table .col2 {
width: 72%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center
}
dl.review-post-table .table-radio input {
margin: 0 1px 0 5px
}
dl.review-post-table .table-radio input:first-of-type {
margin: 0 1px 0 0
}
.col2 #comment {
border-color: #b8b8b8;
margin-bottom: 0
}
label[for=file_photo] br {
display: none
}
.file_path {
display: block;
width: 120px;
text-align: center;
color: #fff;
background: #7e7e7e;
border-radius: 3px;
cursor: pointer
}
#sakura_local_photo {
background: #fbfbfb;
text-align: center;
margin-bottom: 10px
}
#sakura_local_photo img {
margin: 10px 0
}
#upload_reset {
margin: 0 0 0 5px
}
div.review-post-button button.long {
border: 0;
border-radius: 5px;
background: url('https://oripalette.jp/media/img/media/uploads/2019/03/2019y03m15d_0813524073.png') right 20px center/10px no-repeat #5fb9f5
}
#main-contents dl.review-search-table .search-area {
margin: 0
}
.sakura-search-table dd.search-area input,
dl.review-search-table .search-area input {
width: 80%;
border: 1px solid #888;
border-right: 0
}
.sakura-search-table dd.search-area button,
dl.review-search-table .search-area button {
width: 20%;
margin-left: auto;
background: #5fb9f5;
border: 0;
color: #FFF;
border-radius: 0 5px 5px 0;
padding: 8px 0
}
#main-contents .review-search-table dd.app-icon-area {
margin: 0
}
.review-search-table dd.app-icon-area {
padding: 14px;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start
}
.review-search-table dd.app-icon-area div,
.sakura-search-table dd.app-icon-area div {
width: 93px
}
dd.app-icon-area div a {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column
}
body .post a.cvBts-haru+br,
dd.app-icon-area div a br {
display: none
}
dd.app-icon-area div a span {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2
}
dd.app-icon-area div a img {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
border: 1px solid #e8e8e8;
border-radius: 18px
}
.review_sort_box span {
display: inline-block;
width: 160px;
text-align: center;
background: #e94d8a;
color: #fff;
border: 1px solid #e94d8a;
position: relative;
padding: 1px 0
}
.review_sort_box span:after {
display: inline-block;
content: '';
position: absolute;
right: 0;
left: 0;
bottom: -10px;
width: 0;
height: 0;
margin: auto;
border-style: solid;
border-color: #e94d8a transparent transparent;
border-width: 10px 9px 0
}
body .post .review_sort_box a {
display: inline-block;
width: 160px;
text-align: center;
background: #fff;
border: 1px solid #e94d8a;
color: #e94d8a;
padding: 1px 0
}
#main-contents .review-list-box .review-list-table .list-area,
#main-contents .sakura-search-table .app-icon-area {
margin: 0;
padding: 15px 12px;
background-color: #fff;
border-bottom: 1px solid #e2e2e2;
border-left: 1px solid #e2e2e2;
border-right: 1px solid #e2e2e2;
box-sizing: border-box
}
.list-area-top img {
width: 56px;
height: 51px
}
dl.review-list-table .list-area .list-area-top .title {
padding-left: 4px;
width: 20%
}
#main-contents .review-list-box .review-list-table .list-area .list-area-bottom {
margin-bottom: 2px;
font-size: 12px;
text-align: right
}
.list-area-bottom span {
margin-right: 15px
}
.sakura-list-table .list-area-bottom span {
margin-right: 0
}
.review-list-box .review-list-table .list-area .list-area-bottom button.good-button {
margin: 4px 10px 0 0;
padding: 2px 10px;
background: #5d5d5d;
border: 0;
color: #fff
}
.review-list-box .review-list-table .list-area .list-area-bottom .good-num {
margin: 4px 0 0;
padding: 2px 8px;
text-align: center;
border-radius: 30px;
font-size: 12px;
font-weight: 700;
background: #ffafaf;
border: 0;
color: #FFF
}
#main-contents .review-list-box .review-list-table .list-area .list-area-bottom+p {
margin-bottom: 0
}
.review-list-table .list-page-area {
padding-top: 10px
}
div.title span:first-child {
font-size: 14px
}
#main-contents section.top-member-box h2,
#main-contents section.top-twitter-box h2 {
color: #FFF;
background: url('https://oripalette.jp/media/img/common/top/h2-bg-r.png') right center no-repeat, url('https://oripalette.jp/media/img/common/top/h2-bg-l.png') left center no-repeat #333;
font-size: 18px;
font-weight: 700;
padding: 8px 10px;
margin-bottom: 10px;
text-align: center
}
.member-box-in {
position: relative;
margin-bottom: 20px;
padding: 10px 0
}
.member-box-in ul {
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: center;
align-items: center
}
.member-box-in ul li {
width: 29%;
text-align: center;
margin: 5px 5px 10px;
display: block
}
.widget-rank-wrap.member-box-in ul li img{
width: 90px;
height: 90px;
object-fit: cover;
margin: 0 auto;
display: block;
border-radius: 50%;
cursor: pointer;
transition-duration: 0.8s
}
.member-box-in ul li img:hover {
opacity: .8;
cursor: pointer;
transform: scale(1.1);
transition-duration: 1s;
transition-timing-function: ease
}
.widget-rank-wrap.member-box-in ul li span{
display: block;
line-height: normal;
font-size: 15px;
margin-top: 5px
}
.ranking-main-dl li:nth-of-type(1) {
top: 78px
}
.ranking-main-dl li:nth-of-type(2) {
top: 185px
}
.ranking-main-dl li:nth-of-type(3) {
top: 292px
}
.ranking-main-dl li:nth-of-type(4) {
top: 400px
}
.ranking-main-dl li:nth-of-type(5) {
top: 507px
}
.ranking-main-dl li:nth-of-type(6) {
top: 615px
}
.ranking-main-dl li img {
width: 95%;
margin-right: 8px;
height: auto
}
.ranking-main-dl li {
position: absolute;
width: 50%;
z-index: 1;
display: -webkit-flex;
display: flex;
align-items: center;
right: 0
}
.ranking-main-dl img {
position: relative;
top: 0;
display: block;
z-index: 0;
width: 100%;
margin: 0 auto
}
#main-contents .scroll-img-wrap .slide-app-you {
width: 100%;
height: auto;
padding: 20px;
background: -webkit-repeating-linear-gradient(-45deg,#dcf9d9,#dcf9d9 2px,#ceefca 2px,#ceefca 8px);
background: repeating-linear-gradient(-45deg,#dcf9d9,#dcf9d9 2px,#ceefca 2px,#ceefca 8px);
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box
}
#main-contents .scroll-img-wrap ul.slide-app-wrap {
margin: 0;
padding: 0;
width: 300px
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-icon {
width: 100%;
text-align: center;
margin: 0 auto;
display: block
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-icon img {
width: 100px;
border-radius: 10px;
margin-bottom: 20px;
box-shadow: 0 4px 0 0 #117704;
transition: 0.6s
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-icon img:active {
-webkit-transform: translateY(4px);
transform: translateY(4px);
box-shadow: 0 0 1px rgba(0, 0, 0, .2);
border-bottom: none
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-bt {
width: 100%;
text-align: center;
margin: 0 auto;
display: block
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-bt a {
padding: 15px;
width: 100%;
box-sizing: border-box;
background: #f89b00;
border-radius: 5px;
text-decoration: none;
margin: 0 auto;
display: block;
font-size: 16px;
color: #fff;
box-shadow: 0 4px 0 0 #de6000;
transition: 0.6s
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-bt a:hover {
background: #f80;
box-shadow: 0 4px 1px 0 #de6000
}
#main-contents .scroll-img-wrap ul.slide-app-wrap li.slide-app-bt a:active {
-webkit-transform: translateY(4px);
transform: translateY(4px);
box-shadow: 0 0 1px rgba(0, 0, 0, .2);
border-bottom: none
}
#main-contents .scroll-img-wrap .slide-app-in.slide-youbride ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #117704
}
#main-contents .scroll-img-wrap .slide-app-in.slide-omiai ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #3494ce
}
#main-contents .scroll-img-wrap .slide-app-in.slide-koimusubi ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #960130
}
#main-contents .scroll-img-wrap .slide-app-in.slide-enmusubi ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #b38144
}
#main-contents .scroll-img-wrap .slide-app-in.slide-tinder ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #d41512
}
#main-contents .scroll-img-wrap .slide-app-in.slide-toukare ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #2f2f2f
}
#main-contents .scroll-img-wrap-hi .slide-app-in.slide-matchcom ul.slide-app-wrap li.slide-app-icon img {
box-shadow: 0 4px 0 0 #121880
}
.rbt-img-cv img {
height: 34%;
margin: 5px
}
#main-contents table.voiceBox+p+table td a {
font-size: 10px
}
#main-contents table.voiceBox+p+table th span:first-of-type {
font-size: 11px !important
}
body .post a.cvBts-haru {
color: #FFF;
display: block
}
#main-contents .cvBts-haru,
.cvBts-haru {
display: inline-block;
overflow: hidden;
line-height: 1.3;
padding: 10px 0;
border-radius: 10px;
margin: auto;
cursor: pointer;
box-shadow: 0 2px 2px rgba(0, 0, 0, .29);
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
text-align: center
}
.cvBts-haru {
position: relative;
width: 90%;
background: #f89b00;
border-bottom: solid 6px #de6000
}
.cvBts-haru:hover {
opacity: .6
}
#main-contents .cvBts-haru:before,
.cvBts-haru:before {
animation: kirakira 3s ease-in-out infinite;
height: 100%;
left: 0;
opacity: 0;
top: -180px;
transform: rotate(45deg);
content: ""
}
.cvBts-haru:before {
background-color: #fff;
position: absolute;
width: 30px
}
.cvBts-haru span {
font-size: 18px;
font-weight: 700
}
#main-contents .cvBts-haru {
position: relative;
width: 90%;
background: #ff9bac;
border-bottom: solid 6px #e65d75
}
#main-contents .cvBts-haru:before {
background-color: #fff;
position: absolute;
width: 30px
}
.cvBts-heart:hover,
.happymail-doku:hover {
opacity: .6
}
#main-contents p.coPtxt-haru {
display: block;
margin: 0;
padding: 0;
font-weight: 700;
font-size: 16px;
position: relative;
color: #ff617c;
text-align: center
}
#main-contents p.coPtxt-haru:before {
content: "";
border-left: 2px solid #ff617c;
width: 15px;
height: 20px;
transform: rotate(-30deg);
display: inline-block
}
#main-contents p.coPtxt-haru:after {
content: "";
border-right: 2px solid #ff617c;
width: 15px;
height: 20px;
transform: rotate(30deg);
display: inline-block
}
#main-contents .cvBts-box-haru:after,
#main-contents .cvBts-box-haru:before {
content: "";
width: 100px;
height: 200px;
position: absolute;
top: -30px;
bottom: 0;
margin: auto;
z-index: 1
}
#main-contents .cvBts-box-haru:before {
background: url('https://oripalette.jp/media/img/common/icon/sakura-l.png') center no-repeat;
background-size: 45%;
display: block;
left: -340px;
right: 0
}
#main-contents .cvBts-box-haru:after {
background: url('https://oripalette.jp/media/img/common/icon/sakura-r.png') center no-repeat;
background-size: 45%;
display: block;
left: 0;
right: -340px
}
body .post a.cvBts-heart {
color: #FFF;
display: block
}
body .post a.cvBts-heart+br {
display: none
}
.cvBts-box-haru {
margin: 0 0 30px;
overflow: hidden
}
#main-contents .cvBts-heart,
.cvBts-heart {
display: inline-block;
overflow: hidden;
line-height: 1.3;
padding: 10px 0;
border-radius: 10px;
margin: auto;
cursor: pointer;
box-shadow: 0 2px 2px rgba(0, 0, 0, .29);
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
text-align: center
}
.cvBts-box-haru p {
text-align: center
}
.cvBts-heart {
position: relative;
width: 90%;
background: #f89b00;
border-bottom: solid 6px #de6000
}
#main-contents .cvBts-heart:before,
.cvBts-heart:before {
height: 100%;
left: 0;
opacity: 0;
top: -180px;
transform: rotate(45deg);
content: "";
animation: kirakira 3s ease-in-out infinite
}
.cvBts-heart:before {
background-color: #fff;
position: absolute;
width: 30px
}
.cvBts-heart span {
font-size: 18px;
font-weight: 700
}
#main-contents .cvBts-heart {
position: relative;
width: 90%;
background: #ff9bac;
border-bottom: solid 6px #e65d75
}
#main-contents .cvBts-heart:before {
background-color: #fff;
position: absolute;
width: 30px
}
#main-contents p.coPtxt-heart {
display: block;
margin: 0;
padding: 0;
font-weight: 700;
font-size: 16px;
position: relative;
color: #ff617c;
text-align: center
}
#main-contents p.coPtxt-heart:before {
content: "";
border-left: 2px solid #ff617c;
width: 15px;
height: 20px;
transform: rotate(-30deg);
display: inline-block
}
#main-contents p.coPtxt-heart:after {
content: "";
border-right: 2px solid #ff617c;
width: 15px;
height: 20px;
transform: rotate(30deg);
display: inline-block
}
body .post .cvBts-box-hanabi a.cvBts,
body .post .cvBts-box-heart a.cvBts,
body .post .cvBts-box-summer a.cvBts,
body .post .cvBts-box-summer2 a.cvBts {
border-radius: 10px;
cursor: pointer;
box-shadow: 0 2px 2px rgba(0, 0, 0, .29);
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
text-align: center;
overflow: hidden;
line-height: 1.3;
padding: 10px 0
}
#main-contents .cvBts-box-heart:after,
#main-contents .cvBts-box-heart:before {
content: "";
display: block;
width: 100px;
height: 200px;
position: absolute;
top: -30px;
bottom: 0;
z-index: 1;
margin: auto
}
#main-contents .cvBts-box-heart:before {
background: url('https://oripalette.jp/media/img/common/icon/heart01.png') center no-repeat;
background-size: 35%;
left: -320px;
right: 0
}
#main-contents .cvBts-box-heart:after {
background: url('https://oripalette.jp/media/img/common/icon/heart02.png') center no-repeat;
background-size: 35%;
left: 0;
right: -320px
}
body .post .cvBts-box-heart a.cvBts {
display: inline-block;
position: relative;
width: 95%;
margin: auto;
background: #ff9bac;
border-bottom: solid 6px #e65d75
}
#main-contents .cvBts-box-hanabi:after,
#main-contents .cvBts-box-hanabi:before {
content: "";
display: block;
height: 200px;
position: absolute;
bottom: 0;
z-index: 1
}
.cvBts-box-hanabi {
margin: 0 0 15px;
overflow: hidden
}
.cvBts-box-hanabi p {
text-align: center
}
#main-contents .cvBts-box-hanabi:before {
background: url('https://oripalette.jp/media/img/common/icon/kingyo01.png') center no-repeat;
background-size: 35%;
width: 150px;
top: -40px;
left: -310px;
right: 0;
margin: auto
}
#main-contents .cvBts-box-hanabi:after {
background: url('https://oripalette.jp/media/img/common/icon/hanabi02.png') center no-repeat;
background-size: 35%;
width: 140px;
top: -46px;
left: 0;
right: -310px;
margin: auto
}
body .post .cvBts-box-hanabi a.cvBts {
display: inline-block;
position: relative;
width: 90%;
margin: auto;
background: #4644a0;
border-bottom: solid 6px #333179
}
#main-contents .cvBts-box-summer:after,
#main-contents .cvBts-box-summer:before {
content: "";
display: block;
height: 200px;
position: absolute;
bottom: 0;
z-index: 1
}
.cvBts-box-summer {
margin: 0 0 15px;
overflow: hidden
}
.cvBts-box-summer p {
text-align: center
}
#main-contents .cvBts-box-summer:before {
background: url('https://oripalette.jp/media/img/common/icon/summer03.png') center no-repeat;
background-size: 35%;
width: 150px;
top: -40px;
left: -310px;
right: 0;
margin: auto
}
#main-contents .cvBts-box-summer:after {
background: url('https://oripalette.jp/media/img/common/icon/summer02.png') center no-repeat;
background-size: 35%;
width: 140px;
top: -46px;
left: 0;
right: -310px;
margin: auto
}
body .post .cvBts-box-summer a.cvBts {
display: inline-block;
position: relative;
width: 90%;
margin: auto;
background: #ff9bac;
border-bottom: solid 6px #e65d75
}
#main-contents .cvBts-box-summer2:after,
#main-contents .cvBts-box-summer2:before {
content: "";
display: block;
height: 200px;
position: absolute;
bottom: 0;
z-index: 1
}
.cvBts-box-summer2 {
margin: 0 0 15px;
overflow: hidden
}
.cvBts-box-summer2 p {
text-align: center
}
#main-contents .cvBts-box-summer2:before {
background: url('https://oripalette.jp/media/img/common/icon/summer03.png') center no-repeat;
background-size: 35%;
width: 115px;
top: -45px;
left: -320px;
right: 0;
margin: auto
}
#main-contents .cvBts-box-summer2:after {
background: url('https://oripalette.jp/media/img/common/icon/summer02.png') center no-repeat;
background-size: 35%;
width: 130px;
top: -36px;
left: 0;
right: -320px;
margin: auto
}
body .post .cvBts-box-summer2 a.cvBts {
display: inline-block;
position: relative;
width: 75%;
margin: auto;
background: #229af3;
border-bottom: solid 6px #1866a0
}
.conve-bt-boxs3 {
width: 100%;
padding: 10px 0 15px;
margin: 20px auto;
border-radius: 5px;
background: #fffce5;
display: block;
box-sizing: border-box
}
body .post .conve-bt-boxs3 .cvBts-box-summer2 a.cvBts {
width: 75%
}
body .post .conve-bt-boxs3 .cvBts-box-summer2 {
margin: 0
}
body .post .conve-bt-boxs3 .cvBts-box-summer2 p,
body .post .conve-bt-boxs3 p.coPtxt-summer2 {
margin: 0 !important
}
body .post .conve-bt-boxs3 .facebookTxt {
margin-top: 5px
}
#main-contents .soudanzyo .cvBts-box-summer2:before {
top: -10px
}
#main-contents .soudanzyo .cvBts-box-summer2:after {
top: 0
}
#main-contents .cvBts-box-autumn:after,
#main-contents .cvBts-box-autumn:before {
content: "";
display: block;
height: 200px;
position: absolute;
top: -25px;
bottom: 0;
z-index: 1
}
.cvBts-box-autumn {
margin: 0 0 15px;
overflow: hidden
}
.cvBts-box-autumn p {
text-align: center
}
#main-contents .cvBts-box-autumn:before {
background: url('https://oripalette.jp/media/img/common/icon/autumn-l.png') center no-repeat;
background-size: 30%;
width: 150px;
left: -310px;
right: 0;
margin: auto
}
#main-contents .cvBts-box-autumn:after {
background: url('https://oripalette.jp/media/img/common/icon/autumn-r.png') center no-repeat;
background-size: 30%;
width: 140px;
left: 0;
right: -310px;
margin: auto
}
body .post .cvBts-box-autumn a.cvBts {
display: inline-block;
overflow: hidden;
position: relative;
width: 90%;
line-height: 1.3;
padding: 10px 0;
border-radius: 10px;
text-align: center;
margin: auto;
cursor: pointer;
background: #ea5e00;
box-shadow: 0 2px 2px rgba(0, 0, 0, .29);
border-bottom: solid 6px #923b00;
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid transparent
}
.happymail-doku,
.happymail-kikon {
padding: 5px 0;
cursor: pointer;
box-shadow: 0 2px 2px rgba(0, 0, 0, .29);
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
text-align: center;
overflow: hidden
}
body .post .conve-bt-boxs3 .cvBts-box-autumn a.cvBts {
width: 75%
}
body .post .conve-bt-boxs3 .cvBts-box-autumn {
margin: 0
}
body .post .conve-bt-boxs3 .cvBts-box-autumn p,
body .post .conve-bt-boxs3 p.coPtxt-autumn {
margin: 0 !important
}
.happymail-doku {
display: block;
position: relative;
width: 100%;
height: 60px;
border-radius: 10px;
margin: 5px auto;
background: #f89b00;
background-size: 200%;
border-bottom: solid 4px #de6000
}
.happymail-doku:before {
animation: kirakira 3s ease-in-out infinite;
background-color: #fff;
content: " ";
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: -180px;
transform: rotate(45deg);
width: 30px
}
.cvBts:hover,
.happymail-kikon:hover {
opacity: .6
}
.happymail-doku:after {
content: '▶';
position: absolute;
right: 6px;
top: 42%;
color: #de6000;
font-size: 10px;
background: #fff;
width: 15px;
line-height: 15px;
border-radius: 50%;
text-align: center;
margin-top: 0
}
.happymail-doku span {
display: block;
color: #fff;
font-size: 11px;
line-height: 1.8
}
.happymail-doku span:last-of-type {
position: relative;
display: inline;
bottom: 8px
}
.happymail-doku span:last-of-type:after,
.happymail-doku span:last-of-type:before {
position: absolute;
top: 0;
content: '';
width: 15px;
height: 15px
}
.happymail-doku span:first-of-type img {
display: none
}
.happymail-doku span:last-of-type:before {
left: -15px;
background: url('https://oripalette.jp/media/img/media/uploads/2019/04/2019y04m05d_1931114886.png') top left/contain no-repeat
}
.happymail-doku span:last-of-type:after {
right: -15px;
background: url('https://oripalette.jp/media/img/media/uploads/2019/04/2019y04m05d_1931100405.png') top right/contain no-repeat
}
.happymail-doku span:nth-of-type(2) {
font-size: 14px;
font-weight: 700
}
.happymail-kikon {
display: block;
position: relative;
width: 100%;
height: 60px;
border-radius: 10px;
margin: 5px auto;
background: #78afda;
background-size: 200%;
border-bottom: solid 4px #3381bd
}
.happymail-kikon:before {
animation: kirakira 3s ease-in-out infinite;
background-color: #fff;
content: " ";
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: -180px;
transform: rotate(45deg);
width: 30px
}
.happymail-kikon:after {
content: '▶';
position: absolute;
right: 6px;
top: 42%;
color: #3381bd;
font-size: 10px;
background: #fff;
width: 15px;
line-height: 15px;
border-radius: 50%;
text-align: center;
margin-top: 0
}
.happymail-kikon span {
display: block;
color: #fff;
font-size: 11px;
line-height: 1.8
}
.happymail-kikon span:last-of-type {
position: relative;
display: inline;
bottom: 8px
}
.happymail-kikon span:first-of-type img {
display: none
}
.happymail-kikon span:last-of-type:before {
position: absolute;
content: '';
top: 0;
left: -15px;
width: 10px;
height: 15px;
background: url('https://oripalette.jp/media/img/media/uploads/2019/04/2019y04m05d_1931114886.png') top left/contain no-repeat
}
.happymail-kikon span:last-of-type:after {
position: absolute;
top: 0;
right: -15px;
content: '';
width: 15px;
height: 15px;
background: url('https://oripalette.jp/media/img/media/uploads/2019/04/2019y04m05d_1931100405.png') top right/contain no-repeat
}
.happymail-kikon span:nth-of-type(2) {
font-size: 14px;
font-weight: 700
}
.conve-bt-boxs2 {
text-align: center;
width: 100%;
padding: 10px 0 0;
margin: 0 auto 25px;
display: block;
border: 0 solid #ff3c70;
border-radius: 5px;
background: #f0f4f7
}
#main-contents .conve-bt-boxs2 p.bt-download-txt {
font-size: 16px;
font-weight: 700;
margin: 0;
color: #ff3249
}
.conve-bt-boxs2 p.bt-download-txt+p {
position: relative
}
.conve-bt-boxs2 p {
margin-bottom: 0
}
.conve-bt-boxs2 .bt-download-txt a {
color: #ff3249;
display: inline-block;
width: auto
}
.conve-bt-boxs2 .conve-double-in {
display: flex;
justify-content: center;
align-items: center
}
#main-contents .conve-bt-boxs2 .conve-double-in p {
margin: 5px;
width: 50%;
box-sizing: border-box
}
#main-contents .conve-bt-boxs2 .conve-double-in p:last-of-type {
margin: 5px 10px 5px 5px;
width: 50%;
box-sizing: border-box
}
.conve-bt-boxs2.pc-none {
display: block
}
.conve-bt-boxs2.sp-none {
display: none
}
td.tokucho {
border: 0;
line-height: normal
}
td.dlbt-box .bt-rank-dl a,
td.dlbt-box .bt-rank-syousai a {
box-sizing: border-box;
border-radius: 5px;
font-size: 11px;
text-decoration: none;
color: #FFF;
font-weight: 700
}
.osusume-app-table td.dlbt-box {
padding: 3px 2px 5px;
border-bottom: 1px dashed #e2e2e2
}
td.dlbt-box div.dlbt-box-in {
display: flex;
justify-content: center;
align-items: center
}
td.dlbt-box .bt-rank-dl,
td.dlbt-box .bt-rank-syousai {
width: 50%;
text-align: center;
margin: 1px
}
td.dlbt-box .bt-rank-dl a {
padding: 5px 2px;
width: 100%;
height: 100%;
background: #ff83ae;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0 2px 0 0 #d20151
}
td.dlbt-box .bt-rank-dl a:before {
content: "";
width: 12px;
height: 12px;
background: url(https://oripalette.jp/media/img/media/uploads/2021/03/2021y03m11d_1239048819.png) center/100% 100% no-repeat;
display: inline-block;
margin-right: 5px
}
td.dlbt-box .bt-rank-syousai a {
padding: 5px;
width: 100%;
height: 100%;
background: #4baef3;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0 2px 0 0 #006ac1
}
td.dlbt-box .bt-rank-syousai a:before {
content: "";
width: 12px;
height: 12px;
background: url(https://oripalette.jp/media/img/media/uploads/2021/03/2021y03m11d_1239041425.png) center/100% 100% no-repeat;
display: inline-block;
margin-right: 5px
}
.app-area div.app-area-bottom+p a {
display: none
}
.applist-box-in ul.top-app-list {
margin: 10px 0 0;
display: block;
padding: 0 10px
}
.applist-box-in ul.top-app-list li {
display: inline-block;
width: 24%;
margin: 0;
text-align: center
}
.applist-box-in ul.top-app-list li img {
width: 70px;
border-radius: 10px;
border: 1px solid #e2e2e2
}
.applist-box-in ul.top-app-list li span {
display: inline-block;
font-size: 11px;
font-weight: 700;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
margin-top: 5px
}
#main-contents .osusume-app-table .tokucho-tag li {
display: inline-block;
width: 30%;
margin: 0 2px 5px 0;
color: #777;
padding: 8px 0;
border: 1px solid #e6e6e6;
box-sizing: border-box;
border-radius: 5px;
background: #ededed;
text-align: center;
font-size: 11px;
line-height: .5em;
}
#main-contents .osusume-app-table .tokucho-tag li.checked{
background: #ff7c10;
color: #fff;
border: 1px solid #e6761a;
box-sizing: border-box;
}
body .post a.cvBts {
text-decoration: none;
color: #FFF;
display: block
}
body .post a.cvBts+br {
display: none
}
.cvBts-box {
margin: 0 0 30px;
overflow: hidden
}
.cvBts,
.cvBts.midori {
display: inline-block;
overflow: hidden;
position: relative;
width: 90%;
line-height: 1.3;
padding: 10px 0;
border-radius: 10px;
margin: auto;
cursor: pointer;
box-shadow: 0 2px 2px rgba(0, 0, 0, .29);
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
text-align: center
}
.cvBts-box p {
text-align: center
}
.cvBts {
background: #ff9bac;
border-bottom: solid 6px #e65d75
}
.cvBts.midori {
background: #09c289;
border-bottom: solid 6px #007c57
}
.cvBts:before {
animation: kirakira 3s ease-in-out infinite;
background-color: #fff;
content: "";
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: -180px;
transform: rotate(45deg);
width: 30px
}
@keyframes kirakira {
0% {
transform: scale(0) rotate(45deg);
opacity: 0
}
80% {
transform: scale(0) rotate(45deg);
opacity: .5
}
81% {
transform: scale(4) rotate(45deg);
opacity: 1
}
100% {
transform: scale(50) rotate(45deg);
opacity: 0
}
}
.cvBts span {
font-size: 18px;
font-weight: 700
}
.facebookTxt {
display: block;
color: #888;
font-size: 11px;
text-align: center;
line-height: 1.2;
margin-top: 10px
}
#main-contents p.coPtxt {
margin: 0 auto;
padding: 0;
font-weight: 700;
font-size: 16px;
position: relative;
color: #4644a0;
display: block;
text-align: center
}
p.coPtxt:after,
p.coPtxt:before {
content: "";
width: 15px;
height: 20px;
display: inline-block
}
p.coPtxt:before {
border-left: 2px solid #4644a0;
transform: rotate(-30deg)
}
p.coPtxt:after {
border-right: 2px solid #4644a0;
transform: rotate(30deg)
}
.cvBts-box .conve-double-in {
display: flex;
justify-content: center;
align-items: center
}
.cvBts-box .conve-double-in a.cvBts {
margin: 5px 10px;
width: 50%;
box-sizing: border-box
}
.cvBts-box .conve-double-in a.cvBts span {
font-size: 14px
}
@media only screen and(max-width :414px) {
#main-contents section.new2-box article {
min-height: 210px
}
#main-contents .mokujiInfo_off h2,
#main-contents .mokujiInfo_off p.mokujiTitle,
#main-contents .mokujiInfo_on h2,
#main-contents .mokujiInfo_on p.mokujiTitle {
width: 72%;
display: inline-block;
margin: 0
}
.knren-card-wrap dl.knren-card-txt dd,
.knren-card-wrap dl.knren-card-txt dt {
width: 235px
}
.tweet-wrap {
width: 56%;
display: block;
padding-left: 18px
}
.ranking-main-dl li:nth-of-type(1) {
top: 78px
}
.ranking-main-dl li:nth-of-type(2) {
top: 185px
}
.ranking-main-dl li:nth-of-type(3) {
top: 292px
}
.ranking-main-dl li:nth-of-type(4) {
top: 400px
}
.ranking-main-dl li:nth-of-type(5) {
top: 507px
}
.ranking-main-dl li:nth-of-type(6) {
top: 615px
}
}
@media screen and(max-width:375px) {
#main-contents .osusume-app-ranking-wrap .btn-link-box a {
border-radius: 30px;
line-height: 45px;
font-size: 14px
}
#main-contents .mokujiInfo_off h2,
#main-contents .mokujiInfo_off p.mokujiTitle,
#main-contents .mokujiInfo_on h2,
#main-contents .mokujiInfo_on p.mokujiTitle {
width: 72%;
display: inline-block;
margin: 0
}
#main-contents .post ul li.Review-bad>p:nth-of-type(1),
#main-contents .post ul li.Review-good>p:nth-of-type(1) {
width: 76%
}
.knren-card-wrap dl.knren-card-txt dd,
.knren-card-wrap dl.knren-card-txt dt {
width: 210px
}
.tweet-wrap {
width: 52%;
display: block;
padding-left: 10px
}
#categoryBox div.clearfix > div img {
width: 100%;
max-width: 100%;
height: auto;
max-height: 43px;
object-fit: cover;
object-position: center;
box-sizing: border-box;
display: inline-block
}
.review-search-table dd.app-icon-area div,
.sakura-search-table dd.app-icon-area div {
width: 80px
}
.ranking-main-dl li:nth-of-type(1) {
top: 68px
}
.ranking-main-dl li:nth-of-type(2) {
top: 166px
}
.ranking-main-dl li:nth-of-type(3) {
top: 263px
}
.ranking-main-dl li:nth-of-type(4) {
top: 360px
}
.ranking-main-dl li:nth-of-type(5) {
top: 456px
}
.ranking-main-dl li:nth-of-type(6) {
top: 554px
}
}
@media screen and(max-width:360px) {
#sidebar-new-3 ul.ri-app-list li img {
width: 72px
}
#main-contents .osusume-app-ranking-wrap .btn-link-box a {
border-radius: 30px;
line-height: 45px;
font-size: 14px
}
#main-contents .mokujiInfo_off h2,
#main-contents .mokujiInfo_off p.mokujiTitle,
#main-contents .mokujiInfo_on h2,
#main-contents .mokujiInfo_on p.mokujiTitle {
width: 71%;
display: inline-block;
margin: 0
}
a.ranking-inpage {
width: 100%
}
.knren-card-wrap dl.knren-card-txt dd,
.knren-card-wrap dl.knren-card-txt dt {
width: 200px
}
.tweet-wrap {
width: 50%;
display: block;
padding-left: 10px
}
.ranking-main-dl li:nth-of-type(1) {
top: 65px
}
.ranking-main-dl li:nth-of-type(2) {
top: 159px
}
.ranking-main-dl li:nth-of-type(3) {
top: 252px
}
.ranking-main-dl li:nth-of-type(4) {
top: 345px
}
.ranking-main-dl li:nth-of-type(5) {
top: 438px
}
.ranking-main-dl li:nth-of-type(6) {
top: 531px
}
}
@media only screen and(max-width :320px) {
div.shortcode-chart-purpose div.purpose-area {
width: 46%
}
#main-contents p.purpose-data {
box-sizing: border-box;
width: 100%;
margin-bottom: 3px;
line-height: 1.5em;
font-size: 14px;
padding: 5px 0 5px 13px;
background-position: 24% center;
background-size: 15px
}
div.shortcode-chart-gender div.gender-age-area {
box-sizing: border-box;
width: 46%;
height: auto;
margin: 0;
padding: 8px 8px 10px;
border: 2px solid #ccc
}
div.article div.shortcode-purpose-tree {
width: 100%
}
#main-contents .shortcode-purpose-tree li.tree-child {
padding: 23px 3px 0
}
#main-contents ul.purpose-tree.child {
margin-top: 6px
}
#main-contents .shortcode-purpose-tree li.tree-child p {
width: 40px;
font-size: 94%;
height: 20px;
margin-bottom: 8px
}
span.rec-star {
font-size: 90%
}
span.rec-star img {
width: 14px;
margin: 0 0 0 2px;
position: relative;
bottom: 2px
}
#main-contents li.tree-parent {
padding-left: 0
}
#main-contents .mokujiInfo_off h2,
#main-contents .mokujiInfo_off p.mokujiTitle,
#main-contents .mokujiInfo_on h2,
#main-contents .mokujiInfo_on p.mokujiTitle {
width: 69%;
display: inline-block;
margin: 0
}
#main-contents .post ul li.comeBoxM p,
#main-contents .post ul li.comeBoxW p {
width: 63%
}
#main-contents section.new2-box article {
border: 1px solid #e2e2e2;
background: #FFF;
width: 48%;
margin: 0;
display: inline-block;
position: relative;
min-height: 250px
}
#main-contents .post ul li.Review-bad>p:nth-of-type(1),
#main-contents .post ul li.Review-good>p:nth-of-type(1) {
width: 74%
}
a.ranking-inpage {
width: 100%
}
.tweet-wrap {
width: 44.5%;
display: block;
padding-left: 10px
}
.ranking-main-dl li:nth-of-type(1) {
top: 56px
}
.ranking-main-dl li:nth-of-type(2) {
top: 139px
}
.ranking-main-dl li:nth-of-type(3) {
top: 221px
}
.ranking-main-dl li:nth-of-type(4) {
top: 303px
}
.ranking-main-dl li:nth-of-type(5) {
top: 385px
}
.ranking-main-dl li:nth-of-type(6) {
top: 467px
}
}
.contents .article {
display: block;
overflow: hidden
}
.twitter-box-in {
border: 1px solid #ccc;
line-height: 0;
margin-bottom: 10px;
box-sizing: border-box
}
.top-twitter-bt a {
display: block;
background: #20bee2;
margin-bottom: 20px;
text-align: center;
line-height: 40px;
border-radius: 10px;
color: #FFF;
cursor: pointer
}
.top-twitter-bt a:hover {
opacity: .6
}
.f-navi-mokuji_modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: calc(infinity);
background: rgba(0, 0, 0, .8);
overflow: scroll;
display: none
}
.f-navi-mokuji_modal .mokuzi_contents {
background: #fff;
box-sizing: border-box;
width: 95%;
padding: 45px 10px 10px;
margin: 30px auto;
border: 2px solid #ccc;
border-radius: 10px
}
.f-navi-mokuji_modal .mokuzi_contents li {
font-size: 13px
}
.f-navi-mokuji_modal span#modal_close {
position: absolute;
color: #333;
top: 40px;
right: 30px;
margin: 0;
border-radius: 5px;
font-size: 12px;
padding: 2px 5px;
background: #e2e2e2;
width: 50px;
text-align: center;
}
.f-navi-mokuji_modal li {
margin-bottom: 10px;
line-height: 1.8;
font-size: 14px
}
#main-contents section.chumokuapp-box a.linkapp-btn span {
display: inline-block;
background: 0 0;
padding: 0;
margin: 0 -14px 0 10px;
font-size: 14px;
font-weight: 400
}
#main-contents .ninki5-list-wrap {
width: 100%;
margin: 10px auto 500px;
padding: 0;
position: relative
}
#main-contents .ninki5-list-wrap .ninki5-list-box {
display: flex;
align-items: center;
width: 100%;
margin: 0 0 5px;
box-sizing: border-box;
border: 1px solid #efefef;
background: #f5f8fa;
position: relative
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-title {
width: 12%;
text-align: center;
position: absolute;
top: -12px;
left: 10px
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-title img {
border-radius: 10px;
border: 2px solid #ccc;
margin: 0 auto;
display: block
}
#main-contents .ninki5-list-wrap .ninki5-list-box:nth-of-type(1) .ninki5-list-title a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/ninki5-icon-1.png') center/20px no-repeat;
width: 30px;
height: 30px;
position: absolute;
left: -10px;
top: 10px
}
#main-contents .ninki5-list-wrap .ninki5-list-box:nth-of-type(2) .ninki5-list-title a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/ninki5-icon-2.png') center/20px no-repeat;
width: 30px;
height: 30px;
position: absolute;
left: -10px;
top: 10px
}
#main-contents .ninki5-list-wrap .ninki5-list-box:nth-of-type(3) .ninki5-list-title a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/ninki5-icon-3.png') center/20px no-repeat;
width: 30px;
height: 30px;
position: absolute;
left: -10px;
top: 10px
}
#main-contents .ninki5-list-wrap .ninki5-list-box:nth-of-type(4) .ninki5-list-title a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/ninki5-icon-4.png') center/20px no-repeat;
width: 30px;
height: 30px;
position: absolute;
left: -10px;
top: 15px
}
#main-contents .ninki5-list-wrap .ninki5-list-box:nth-of-type(5) .ninki5-list-title a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/ninki5-icon-5.png') center/20px no-repeat;
width: 30px;
height: 30px;
position: absolute;
left: -10px;
top: 15px
}
#main-contents .ninki5-list-wrap .ninki5-list-box:nth-of-type(6) .ninki5-list-title a:before {
content: "";
background: url('https://oripalette.jp/media/img/common/icon/ninki5-icon-pr.png') center/20px no-repeat;
width: 30px;
height: 30px;
position: absolute;
left: -10px;
top: 15px
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main {
width: 100%;
display: flex;
align-items: center;
-webkit-flex-wrap: wrap;
flex-wrap: wrap
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtitle-box {
width: 100%;
margin: 0;
background: #b5c0d0;
padding: 5px 0 8px 70px;
color: #FFF
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtitle-box dt {
width: 100%;
display: block;
font-size: 18px;
font-weight: 700;
padding: 0 0 0 5px;
box-sizing: border-box
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtitle-box dd {
width: 95%;
display: flex;
align-items: center;
margin: 0
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtitle-box dd a {
width: 100%;
padding: 1px;
text-align: center;
text-decoration: none;
border-radius: 50px;
color: #FFF;
font-weight: 700;
cursor: pointer;
display: block;
font-size: 12px
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtitle-box dd a:nth-of-type(1) {
margin: 0 10px 0 0;
background: #fb558f;
box-shadow: 0 2px 0 0 #d10050
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtitle-box dd a:nth-of-type(2) {
margin: 0;
background: #1c9af2;
box-shadow: 0 2px 0 0 #006ac1
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box {
width: 100%;
display: flex;
align-items: center;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 0;
padding: 0 10px 5px;
background: #fff
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dt {
width: 100%;
display: block;
font-size: 16px;
font-weight: 700;
color: #5f5f5f;
padding: 10px 0 0
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-price {
width: 55%;
color: #5f5f5f;
margin: 0
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-price span {
position: relative;
width: 100%
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-price span.icon-man:before {
content: "男";
background: #5da9e4;
padding: 5px 6px;
border-radius: 50%;
margin-right: 10px;
font-size: 12px;
font-weight: 700;
color: #fff
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-price span.icon-woman:before {
content: "女";
background: #f36091;
padding: 5px 6px;
border-radius: 50%;
margin-right: 10px;
font-size: 12px;
font-weight: 700;
color: #fff
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-genre {
width: 45%;
margin: 0
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-genre ul {
display: flex;
align-items: center;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 0;
padding: 5px
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-genre li {
width: 30%;
text-align: center;
margin: 2px;
padding: 0;
line-height: 21px;
border: 1px solid #e2e2e2;
background: #f5f8fa;
box-sizing: border-box;
border-radius: 4px;
font-size: 12px;
color: #9c9c9c
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-genre li.icon-on {
width: 30%;
text-align: center;
margin: 2px;
padding: 0;
line-height: 21px;
border: 1px solid #bce8e3;
background: #3edbc8;
box-sizing: border-box;
border-radius: 4px;
font-size: 12px;
color: #fff;
font-weight: 700
}
#main-contents .ninki5-list-wrap .ninki5-list-box .ninki5-list-main dl.subtxt-box dd.app-genre li:nth-of-type(n+4).icon-on {
width: 30%;
text-align: center;
margin: 2px;
padding: 0;
line-height: 21px;
border: 1px solid #fbdec1;
background: #ffb469;
box-sizing: border-box;
border-radius: 4px;
font-size: 12px;
color: #fff;
font-weight: 700
}
body.home.blog .footer-navi-wrap ul li.f-navi-rank a:after {
content: "NEW";
width: auto;
right: 5px;
top: 5px;
background: #fb568e;
padding: 1px 5px;
font-size: 10px;
border-radius: 10px;
margin: auto;
position: absolute;
display: block;
text-align: center;
line-height: normal;
opacity: .8;
animation: flash 2s linear infinite
}
@keyframes flash {
0,
100% {
opacity: 1
}
50% {
opacity: .4
}
}
.hm-over-bt {
display: none
}
.acd-box {
margin: 0 0 20px;
padding: 0;
max-width: 100%
}
.acd-box label {
border: 1px solid #bbb;
border-radius: 3px;
padding: 7px 5px;
text-align: center;
display: block;
box-shadow: none;
background: #FFF;
color: #666;
cursor: pointer;
position: relative;
transition: all 0.5s;
width: 95%;
margin: 0 auto
}
.acd-box label:after,
.acd-box label:before {
position: absolute;
left: 0;
right: 0;
margin: auto;
z-index: 5px;
border-bottom: 1px solid #bbb;
border-left: 1px solid #bbb;
border-right: 1px solid #bbb
}
.acd-box label:before {
content: '';
bottom: -4px;
width: 99%;
height: 2px
}
.acd-box label:after {
content: "";
bottom: -7px;
width: 98%;
height: 1px
}
.acd-box label:hover {
background: #f3f3f3
}
.acd-box input {
display: none
}
.acd-box .acd-conte {
height: 0;
padding: 0;
overflow: hidden;
opacity: 0;
transition: 0.8s
}
.ck-acd:checked+label+.acd-conte {
height: auto;
padding: 0;
margin: 0;
opacity: 1;
line-height: normal
}
.ck-acd:checked+label+p+.acd-conte {
height: auto;
padding: 0 5px;
margin: 0;
background: #fbfbfb;
opacity: 1;
line-height: normal
}
.acd-box .acd-conte>p:first-of-type {
margin-top: 20px
}
.ck-acd:checked+label:after,
.ck-acd:checked+label:before {
position: relative;
bottom: 0;
margin: auto;
z-index: 5px;
width: 100%;
height: auto;
border: 0;
right: 0
}
.ck-acd:checked+label:before {
content: '▼';
left: -10px
}
.ck-acd:checked+label:after {
content: "";
left: 0
}
.ck-acd:checked+label {
background: #a0a0a0;
color: #FFF;
border: 0;
border-radius: 3px 3px 0 0;
width: 95%;
margin: 0 auto;
display: none
}
section.chumokuapp-box a.linkapp-btn {
position: absolute;
width: 90%;
height: 35px;
text-align: center;
line-height: 35px;
color: #FFF;
font-size: 14px;
font-weight: 700;
display: block;
bottom: 8px;
left: 0;
right: 0;
margin: auto;
background: #ff9941;
border-bottom: 2px solid #ce7400;
border-radius: 3px;
z-index: 11
}
#main-contents section.chumokuapp-box .scroll-area-top article a.linkapp-btn:before {
display: none
}
#main-contents section.chumokuapp-box .top-chumokuapp-wappa {
width: 100%;
display: flex;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
background: #efefef;
padding: 10px 0;
border-top: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5
}
#main-contents section.chumokuapp-box .top-chumokuapp-wappa::-webkit-scrollbar {
width: 10px;
height: 3px
}
#main-contents section.chumokuapp-box .top-chumokuapp-wappa::-webkit-scrollbar-thumb {
background: #fb568e;
border-radius: 50px
}
#main-contents section.chumokuapp-box .top-chumokuapp-wappa::-webkit-scrollbar-track-piece:start {
background: #fb568e
}
#main-contents section.chumokuapp-box .top-chumokuapp-wappa::-webkit-scrollbar-track-piece:end {
background: #ffdee9
}
.rankBtnLR #rankingBtn {
display: -webkit-flex;
display: flex;
margin: 0 0 20px
}
.rankBtnLR #rankingBtn li {
width: 100% !important;
margin: 0 !important;
display: block
}
.rankBtnLR #rankingBtn li:first-child {
width: 100% !important;
margin: 0 2px 0 0 !important;
display: block
}
.rankBtnLR #rankingBtn li a {
width: 100% !important;
display: block;
text-align: center;
margin: 0 10px 0 0;
border: 0
}
.HYlist {
display: block;
box-sizing: border-box;
margin: 10px auto;
padding: 10px;
border: 1px solid #d8d8d8;
border-radius: 5px
}
.HYlist .HYlist-midasi {
text-align: center;
font-size: 20px;
font-weight: 700;
line-height: 30px;
margin: 0 0 10px;
line-height: 20px;
margin-bottom: 0px!important;
padding: 0 0 10px;
width: 100%;
border-bottom: 1px solid #d8d8d8
}
#main-contents p.HYlist-midasi.HYlist-midasi_test {
    margin-bottom: 0px;
    line-height: 20px;
}
.HYlist .HYlist-midasi img {
    width: 40px;
    border-radius: 10px;
    margin: 0 auto 10px;
    border: 1px solid #d8d8d8;
    display: block;
}
.HYlist dl {
padding: 5px 5px 0px 5px;
margin: 5px 0;
border-bottom: 1px dotted #95a4ab
}
.HYlist dl:nth-of-type(5) {
padding: 10px;
margin: 5px 0;
border-bottom: 0
}
.HYlist dl dt {
display: -webkit-flex;
display: flex;
align-items: center;
margin-bottom: 0;
line-height: 35px
}
.HYlist dl dt img {
width: 8%;
margin: 0 10px 0 0;
box-sizing: border-box
}
.HYlist dl dt .HYlist-h {
width: 60%;
margin: 0 10px 0 0;
font-size: 16px;
font-weight: 700;
box-sizing: border-box
}
.HYlist dl dt .HYlist-hoshi {
width: 60%;
text-align: center;
font-weight: 700;
font-size: 20px;
background: #fffbef;
border: 1px solid #efefef;
border-radius: 50px;
color: #ffa131;
box-sizing: border-box
}
.HYlist dl.HYlist-ok {
background: #fffdf0;
border-radius: 10px;
border: 2px solid #eddfa4;
box-sizing: border-box
}
.HYlist dl.HYlist-ng {
background: #faf3ff;
border-radius: 10px;
border: 2px solid #acb0ea;
box-sizing: border-box
}
.HYlist dl dd {
font-size: 14px;
line-height: normal;
padding: 5px
}
.HYlist dl.HYlist-ng dt span.HYlist-h,
.HYlist dl.HYlist-ok dt span.HYlist-h {
width: 100%;
margin: 0 10px 0 0;
font-size: 16px;
font-weight: 700;
box-sizing: border-box;
}
.HYlist .HYlist-midasi span.lead{
display: block;
margin: 0;
font-size: 11px;
color: #adadad;
}
.acMenu li {
line-height: normal !important
}
.yougosyuu-box {
background: #fcfcfc;
border: 2px solid #a3a3a3;
margin: 20px 0
}
#main-contents .yougosyuu-box p {
background: #a3a3a3;
margin: 0;
padding: 0 10px;
display: inline-block;
font-weight: 700;
color: #FFF
}
.yougosyuu-box dl {
margin: 0;
padding: 10px
}
.yougosyuu-box dl dt {
margin: 0;
padding: 0;
line-height: normal;
font-size: 16px;
font-weight: 700
}
#main-contents .yougosyuu-box dl dd {
margin: 0 0 5px;
padding: 0;
line-height: normal;
font-size: 14px
}
.yougosyuu-box dl dd:last-of-type {
margin: 0;
padding: 0;
line-height: normal;
font-size: 14px
}
.article .review-grade-table .grade-score-area .grade-score {
width: 40%;
font-size: 450%;
font-weight: 700
}
.article .review-grade-table .grade-score-area .grade-score-star {
width: 30%
}
.article .review-grade-table .grade-score-area .grade-score-graph {
width: 50%
}
#main-contents .app-zusetsu p {
margin: 0;
}
@media only screen and(max-width :414px) {
.app-zusetsu {
border: 5px solid #36a3ec;
margin-bottom: 30px
}
.app-zusetsu aside {
margin: 0 14px
}
.app-zusetsu .top {
padding: 30px 14px
}
.app-zusetsu .middle {
padding: 24px 14px 30px
}
.app-zusetsu.pcmax .middle {
padding: 12px 14px 6px
}
.top-main-banner img {
width: 100%;
height: 166px
}
#sidebar-new-1 article a.kiji-ss-box img.kiji-ss {
width: 100%;
height: 74px
}
#sidebar-new-3 ul.ri-app-list li img {
width: 78px;
height: 78px
}
}
@media only screen and(max-width :375px) {
.app-zusetsu {
border: 4px solid #36a3ec;
margin-bottom: 26px
}
.app-zusetsu aside {
margin: 0 10px
}
.app-zusetsu .top {
padding: 26px 10px
}
.app-zusetsu .middle {
padding: 20px 10px 26px
}
.app-zusetsu.pcmax .middle {
padding: 10px 10px 4px
}
.top-main-banner img {
width: 100%;
height: 150px
}
#sidebar-new-1 article a.kiji-ss-box img.kiji-ss {
width: 100%;
height: 66px
}
#sidebar-new-3 ul.ri-app-list li img {
width: 78px;
height: 78px
}
}
#main-contents .rankBtnLR #rankingBtn li a {
line-height: 30px;
font-size: 14px
}
body #main-contents table.voiceBox2 td:nth-child(1) p {
margin: 0;
}
body .post .conve-bt-boxs3 .cvBts-box-nov2 a.cvBts{width:75%}
body .post .conve-bt-boxs3 .cvBts-box-nov2{margin:0}
body .post .conve-bt-boxs3 .cvBts-box-nov2 p,body .post .conve-bt-boxs3 p.coPtxt-nov2{margin:0!important}
body .post .cvBts-box-nov2 a.cvBts{display:inline-block;overflow:hidden;position:relative;width:90%;line-height:1.3;padding:10px 0;border-radius:10px;text-align:center;margin:auto;cursor:pointer;background:#ea5e00;box-shadow:0 2px 2px rgba(0,0,0,.29);border-bottom:solid 6px #923b00;border-top:2px solid transparent;border-left:2px solid transparent;border-right:2px solid transparent}
#main-contents .cvBts-box-nov2:after,#main-contents .cvBts-box-nov2:before{content:"";display:block;height:200px;position:absolute;top:-25px;bottom:0;z-index:1}
.cvBts-box-nov2{margin:0 0 15px;overflow:hidden}
.cvBts-box-nov2 p{text-align:center}
#main-contents .cvBts-box-nov2:before{background:url(https://oripalette.jp/media/img/common/icon/nov-l.png) center no-repeat;background-size:30%;width:150px;left:-310px;right:0;margin:auto}
#main-contents .cvBts-box-nov2:after{background:url(https://oripalette.jp/media/img/common/icon/nov-r.png) center no-repeat;background-size:30%;width:140px;left:0;right:-310px;margin:auto}
.category-list {
padding: 8px 5px;
}
.category-list a img{
width: 100px;
}
#main-contents .category-list a p{
width: 68%;
margin-left: auto;
font-size: 12px;
font-weight: 400;
line-height: 1.4;
padding: 0 0 0 10px;
margin-bottom:0;
}
#main-contents .category-list .categorytext{
margin: 10px 0 0;
line-height: normal;
font-size: 10px;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin-bottom:0;
}

#main-contents .cvBts-box-autumn.halloween:before {
background: url(https://oripalette.jp/media/img/common/icon/halloween-1.png) center no-repeat;
background-size: 26%;
width: 150px;
left: -318px;
right: 0;
margin: auto;
top: -12px;
}
#main-contents .cvBts-box-autumn.halloween:after {
background: url(https://oripalette.jp/media/img/common/icon/halloween-2.png) center no-repeat;
background-size: 28%;
width: 140px;
left: 0;
right: -315px;
margin: auto;
top: -10px!important;
}
body .post .cvBts-box-nov a.cvBts{width: 90%;}
body .post .cvBts-box-nov a.cvBts:after{left:0;right:-80%;}

.footerDbtn{
content:"";
position:fixed;
bottom:90px;
right:10px;
width:55px;
height:52px;
border-radius:50px;
text-align:center;
background: url(https://oripalette.jp/media/img/common/icon/download-bt.png) no-repeat center;
background-size:40%;
background-position:center 8px;
background-color:#e04172e3;
border-bottom:3px solid #9e3253;
z-index:10000;
}
.footerDbtn a{
font-size:10px;
padding-top:31px;
color:#FFF;
text-decoration:none!important;
display:block;
}

.spTopBtn{
position: fixed;
background: rgba(0,0,0,.54);
right: 1%;
bottom: 20%;
width: 60px;
height: 60px;
border-radius: 50%;
z-index:10000;
}
.spTopBtn a{
text-decoration:none!important;
font-size:11px!important;
}
.spTopBtn a img {
display: block;
width: 20px;
text-align: center;
margin: 5px auto 5px;
padding: 0;
}

#main-contents .cvBts-box-win.xmas:before {
background: url(https://oripalette.jp/media/img/common/icon/winter-1.png) center no-repeat;
background-size: 26%;
width: 140px;
left: -305px;
right: 0;
margin: auto;
top: 0px;
}
#main-contents .cvBts-box-win.xmas:after {
background: url(https://oripalette.jp/media/img/common/icon/winter-2.png) center no-repeat;
background-size: 28%;
width: 140px;
left: 0;
right: -305px;
margin: auto;
top: 0px!important;
}
body .post .cvBts-box-win a.cvBts{width: 75%;}
body .post .cvBts-box-win a.cvBts:after{left:0;right:-80%;}
.conve-bt-boxs4 {
width: 100%;
padding: 10px 0 15px;
margin: 20px auto;
border-radius: 5px;
display: block;
box-sizing: border-box;
}
body #main-contents p.coPtxt-win{
margin-bottom:5px;
}
.conve-bt-boxs4.xmas-ver {
width: 100%;
padding: 10px 0 15px;
margin: 20px auto;
border-radius: 5px;
display: block;
box-sizing: border-box;
}
body .post .conve-bt-boxs4.xmas-ver .cvBts-box-win a.cvBts{width: 75%;}
body .post .conve-bt-boxs4.xmas-ver .cvBts-box-win a.cvBts:after{left:0;right:-80%;}

a.ranking-inpage-rank{
display: block;
margin: 20px auto;
width: 100%;
padding: 10px 0 10px 20px;
box-sizing:border-box;
text-align: center;
background: #ff5353;
color: #fff;
border-radius: 5px;
position: relative;
font-weight:700;
font-size: 12px;
text-decoration:none!important;
}
a.ranking-inpage-rank:before{
content:"";
position:absolute;
width:20px;
height:20px;
background: url(https://oripalette.jp/media/img/media/uploads/2019/07/2019y07m05d_1327378709.png) center center no-repeat;
background-size: contain;
left:15px;
top:9px;
}
a.ranking-inpage-rank:after{
content:">";
position:absolute;
display:block;
height:auto;
font-size:20px;
top:6px;
left:45px;
width:auto;
font-weight:500;
}

.conve-bt-boxs5 {
width: 100%;
padding: 10px 0 15px;
margin: 20px auto;
border-radius: 5px;
display: block;
box-sizing: border-box;
}
#main-contents .conve-bt-boxs5 .cvBts-box-win.syougatu:before {
background: url(https://oripalette.jp/media/img/common/icon/syougatu-l.png) center no-repeat;
background-size: 26%;
width: 140px;
left: -320px;
right: 0;
margin: auto;
top: -20px;
}
#main-contents .conve-bt-boxs5 .cvBts-box-win.syougatu:after {
background: url(https://oripalette.jp/media/img/common/icon/syougatu-r.png) center no-repeat;
background-size: 28%;
width: 140px;
left: 0;
right: -315px;
margin: auto;
top: -20px!important;
}
body .post .conve-bt-boxs5 .cvBts-box-win a.cvBts{width: 75%;}
body .post .conve-bt-boxs5 .cvBts-box-win a.cvBts:after{left:0;right:-80%;}

.conve-bt-boxs6 {
width: 100%;
padding: 10px 0 15px;
margin: 20px auto;
border-radius: 5px;
display: block;
box-sizing: border-box;
}
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:before {
background: url(https://oripalette.jp/media/img/common/icon/hina-l.png) center no-repeat;
background-size: 30%;
width: 140px;
left: -319px;
right: 0;
margin: auto;
top: -20px;
}
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:after {
background: url(https://oripalette.jp/media/img/common/icon/hina-r.png) center no-repeat;
background-size: 30%;
width: 140px;
left: 0;
right: -315px;
margin: auto;
top: -20px!important;
}
body .post .conve-bt-boxs6 .cvBts-box-win a.cvBts{width: 90%;}
body .post .conve-bt-boxs6 .cvBts-box-win a.cvBts:after{left:0;right:-80%;}
body .post .conve-bt-boxs6 p.coPtxt-win {margin:0!important;padding:0!important;}

.widget-conts .search-form_inputXX form {
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
position:relative;
margin:10px 0;
}
.widget-conts .search-form_inputXX form input[type="text"]{
padding: 4px 0 4px 6px;
width: 70%;
width:80%;
box-sizing:border-box;
border-radius:0;
border:1px solid #888;
}
.widget-conts .search-form_inputXX form input[type="submit"]{
width: 20%;
padding: 4px 0;
border: 1px solid #888;
background: #888;
color: #FFF;
cursor: pointer;
box-sizing:border-box;
border-radius:0;
}


}


@media screen and (max-width: 375px){
.category-list a img {
width: 30%;
height: auto;
max-height: 43px;
object-fit: cover;
object-position: center;
box-sizing: border-box;
}
}



/*------------------------------------------------------------
CVボタン季節デザイン調整用
-------------------------------------------------------------*/

@media screen and (max-width: 415px){
body .post .conve-bt-boxs6 .cvBts-box-win a.cvBts {
width: 75%;
}
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:before {
content:"";
height:200px;
position:absolute;
bottom:0;
margin:auto;
z-index:1;
display:block;
background: url(https://oripalette.jp/media/img/media/uploads/2021/11/2021y11m05d_1925306797.png) center no-repeat;
background-size: 30%;
width: 130px;
left: -345px;
right: 0;
top: -21px;
display:none;

}
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:after {
content:"";
height:200px;
position:absolute;
bottom:0;
margin:auto;
z-index:1;
display:block;
background: url(https://oripalette.jp/media/img/media/uploads/2021/11/2021y11m05d_1925296856.png) center no-repeat;
background-size: 39%;
width: 125px;
left: 0;
right: -346px;
top: -10px!important;
display:none;

}
}

@media screen and (max-width: 376px){
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:before {
background-size: 30%;
width: 120px;
left: -310px;
right: 0;
top: -19px;
}
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:after {
background-size: 39%;
width: 110px;
left: 0;
right: -313px;
top: -15px!important;
}
}

@media screen and (max-width: 360px){
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:before {
background-size: 30%;
width: 110px;
left: -300px;
right: 0;
top: -18px;
}
#main-contents .conve-bt-boxs6 .cvBts-box-win.valen:after {
background-size: 37%;
width: 110px;
left: 0;
right: -300px;
top: -10px!important;
}
}
time{
    font-size: 14px;
    margin-left: -7px;
}
/*---季節デザイン調整end---*/


/*------------------------------------------------------------
TOPページ調整用
-------------------------------------------------------------*/
@media screen and (max-width: 415px){
#top-main #cl-office-list .article-list_cl-office {
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
}
#top-main #cl-office-list .article-list_cl-office article {
    width: 95%;
    margin-bottom: 10px;
}
#top-main #cl-office-list .article-list_cl-office article  h3 {
    border: none;
    font-size: 14px;
    margin: 0 auto;
    text-align: center;
    background: rgb(196 158 137 / 13%);
    color: #70524b;
    padding: 0.8em;
    border-radius: 0.5em;
    width: 90%;
}
.article-list_cl-office article{
    padding: 8px;
}
#main-contents #top-main #cl-office-list .article-list_cl-office article  h3:before,.article-list_cl-office p{
display:none;
}
#main-contents .widget-rank-wrap ul li {
    margin: 5px 5px 10px!important;
}
.widget-rank-wrap.member-box-in a {
    display: block;
}
/*flexにしてみる*/
.article-list_cl-office article a {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
#top-main #cl-office-list .article-list_cl-office article a img{
    width: 45%;
    height: auto;
}
#top-main #cl-office-list .article-list_cl-office article h3{
    width: 50%;
    padding: 8px 3px;
    font-size: 11px;
    margin: 0;
}
#top-main #cl-office-list .article-list_cl-office article h3:after {
    content: "";
    position: absolute;
    width: 6px;
    height: 6px;
    border: 0;
    border-top: solid 2px rgb(196 158 137 / 53%);
    border-right: solid 2px rgb(196 158 137 / 53%);
    position: absolute;
    top: 55%;
    right: 9px;
    margin-top: -4px;
    transform: rotate(45deg);
}
}
/*-------------------------------------------------------
ショートコード用　目次ボタン TOPボタン
-------------------------------------------------------*/
@media only screen and (orientation:landscape) and (max-width : 813px),(orientation:portrait) and (max-width : 753px){
.footer-navi-wrap.short-cord {
display: flex!important;
position: fixed;
bottom: 85px;
width: initial;
left: initial!important;
right: 10px!important;
opacity: 0.8;
display: -webkit-box;
display: -ms-flexbox;
z-index: 99;
}
.footer-navi-wrap.short-cord ul{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.footer-navi-wrap.short-cord li{
display: block;
background: #000000;
font-size: 10px;
border-radius: 50px;
margin: 0 5px;
width: 55px;
height: 55px;
line-height: 75px;
text-align: center;
color: #FFF;
position: relative;
}
.footer-navi-wrap.short-cord li a{
line-height: 38px;
box-sizing: border-box;
color: #FFF;
display: block;
width: 100%;
height: 100%;
padding: 20px 0 0;
text-decoration: none;
letter-spacing: 2px;
padding-left: 2px;
}
.footer-navi-wrap.short-cord li.f-navi-ptop{
display:none;
} 
}
/*-------------------------------------------------------
ウィジェット_カテゴリリスト
-------------------------------------------------------*/
@media only screen and (orientation:landscape) and (max-width : 813px),(orientation:portrait) and (max-width : 753px){
    ul.top_categorylist {
    margin-top: -18px;
    padding: 7px;
}
    ul.top_categorylist li {
    line-height: 1em!important;
}
.top_categorylist a {
    font-size: 15px;
}
.top_categorylist a:before{
    top: 1px;
}
.top_categorylist a:after{
    top: 7px;
}
}