@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
#main {
    padding: 0;
}

#main article {
    margin: 0;
}

img {
    vertical-align: top;
    margin: 0;
    padding: 0;
}

.logo-header {
    display: none;
}

.entry-title {
    display: none;
}

.content { 
    margin: 0; 
}

.entry-content { 
    margin: 0; 
}


.lppc-content {
    position: relative;
}

.lppc-icon-main {
    position: absolute;
    top: 34%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lppc-btn-main {
    position: absolute;
    top: 79%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lppc-icon-a {
    position: absolute;
    top: 6%;
    left: 24.8%;
    transform: translate(-50%, -50%);
}

.lppc-icon-b {
    position: absolute;
    top: 6%;
    left: 41.7%;
    transform: translate(-50%, -50%);
}

.lppc-icon-c {
    position: absolute;
    top: 6%;
    left: 58.7%;
    transform: translate(-50%, -50%);
}

.lppc-icon-d {
    position: absolute;
    top: 6%;
    left: 75.6%;
    transform: translate(-50%, -50%);
}

.lppc-btn-site {
    position: absolute;
    top: 91%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lppc-icon-main:hover,
.lppc-icon-a:hover,
.lppc-icon-b:hover,
.lppc-icon-c:hover,
.lppc-icon-d:hover,
.lppc-btn-main:hover,
.lppc-btn-site:hover {
	opacity: 0.8 ;
}


.lpmb-content {
    position: relative;
}

.lpmb-icon-main {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lpmb-btn-main {
    position: absolute;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lpmb-icon-a {
    position: absolute;
    top: 6%;
    left: 12.5%;
    transform: translate(-50%, -50%);
}

.lpmb-icon-b {
    position: absolute;
    top: 6%;
    left: 37.5%;
    transform: translate(-50%, -50%);
}

.lpmb-icon-c {
    position: absolute;
    top: 6%;
    left: 62.5%;
    transform: translate(-50%, -50%);
}

.lpmb-icon-d {
    position: absolute;
    top: 6%;
    left: 87.5%;
    transform: translate(-50%, -50%);
}

.lpmb-btn-site {
    position: absolute;
    top: 94%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lpmb-icon-main:hover,
.lpmb-icon-a:hover,
.lpmb-icon-b:hover,
.lpmb-icon-c:hover,
.lpmb-icon-d:hover,
.lpmb-btn-main:hover,
.lpmb-btn-site:hover {
	opacity: 0.8 ;
}

.lpmb-hyo div {
    max-width: 2080px;
}


.lpmb-hyo div {
    width: 240%;
    max-width: 2080px;
}

.lpmb-hyo {
   overflow: auto;
   white-space: nowrap;
   -webkit-overflow-scrolling: touch;
}

.lpmb-hyoblock {
    position: relative;
}

.httl-a {
    position: absolute;
    top: 1.2%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.httl-b {
    position: absolute;
    top: 13.9%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.httl-c {
    position: absolute;
    top: 21.6%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.httl-d {
    position: absolute;
    top: 48.4%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.httl-e {
    position: absolute;
    top: 63.5%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.httl-f {
    position: absolute;
    top: 75.6%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.httl-g {
    position: absolute;
    top: 92%;
    height: 1.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}


.foot-wrapper {
    margin: 0;
    height: 60px;
    line-height:60px;
    text-align: center;
    background: #000;
    font-weight: bold;
}

.foot-wrapper p {
    font-size: 0.8rem;
    display: inline-block;
    margin: 0;
}

.foot-wrapper a {
    padding-right: 16px;
}

.foot-wrapper a:link { color: #ffffff; }
.foot-wrapper a:visited { color: #ffffff; }
.foot-wrapper a:hover { color: #0000ff; }
.foot-wrapper a:active { color: #0000ff; }

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
    /*必要ならばここにコードを書く*/
  }

/*834px以下*/
@media screen and (max-width: 834px){
}

/*481px以上*/
@media screen and (min-width: 481px){
    .lpmb-container {
        display: none;
    }
}

/*480px以下*/
@media screen and (max-width: 480px){
    .lppc-container {
        display: none;
    }
}