@charset 'utf-8';

/*
**	LuckyPeaks CSS RESETER
**
**		auther:Toyohiko Yoshimine
*/
* {
    margin:0px; padding:0px; box-sizing:border-box; vertical-align:baseline; backface-visibility:visible; justify-content:center; align-items:center; flex-wrap:wrap;
    /* font-smoothing:antialiased; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; 廃止 */
}
*:before, *:after { justify-content:center; align-items:center; box-sizing:border-box; }

body, textarea, input, button { font-family:"Hiragino Sans", Meiryo, sans-serif; color:#444; }

html { height:100%; overflow-y:scroll; }
body,main,section,article,aside,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,table,tbody,tr,td,a,img {
	padding:0; margin:0; border:none; border-spacing:0;
}
body {
	position:relative;
    width:100%; min-height:100%; height:auto;
    text-align:center; word-break:break-all; word-wrap:break-word; overflow-wrap:break-word;
    font-size:0; line-height:0; letter-spacing:0; text-size-adjust:100%; font-feature-settings:"palt"; font-kerning:normal;
    background:#fff;
}
h1,h2,h3,h4,h5,h6 { font-weight:400; font-size:inherit; line-height:inherit; }
header, footer, section, article, aside, div, ol, ul, li, p, dl, dt, dd, h1, h2, h3, h4, h5, h6, nav, fieldset, figure, button { position:relative; }
ul, ol { list-style:none; }
table { border-collapse: collapse; border: none; border-spacing:0; }
textarea { resize:none; }
i { font-style:normal; }
main { position:absolute; left:0; top:0; width:100%; min-height:100%; overflow:hidden; }
section, figure { overflow:hidden; }
figure img { width:100%; }

a, a:link, a:active, a:visited, a:hover { text-decoration:none; }
a { color:inherit; }
a.block { display:block; }
a.inlineBlock { display:inline-block; }
a.underline { text-decoration:underline; }

/*-----------------------------------------------
    イメージを読み込むまで表示しない
-----------------------------------------------*/
.LPLoadAfterVisible main { visibility:hidden; opacity:0; transition:opacity 0.7s; }
.LPLoadAfterVisible.LPImagesLoaded:not(.LPUseWebFonts) main, /* 通常 */
.LPLoadAfterVisible.LPImagesLoaded.LPUseWebFonts.wf-active main { visibility:visible; opacity:1; } /* Adobe Fonts / Google Fonts を使用している場合 */

/*-----------------------------------------------
    luckypeaks.js 用
-----------------------------------------------*/
.LPDelayLoad { visibility:hidden; opacity:0; transition:all 0.66s; }
.LPDelayLoad.noFade { opacity:1; }
.LPDelayLoad.LPDelayLoaded { visibility:visible; opacity:1; }

.LPDelayLoad.fadeUp { transform:translateY(120px); transition:all 0.6s; }
.LPDelayLoad.LPDelayLoaded.fadeUp { transform:translateY(0); }
@media only screen and (max-width:768px) {	/* MOBILE */
    .LPDelayLoad.fadeUp { transform:translateY(80px); }
}

/*-----------------------------------------------
    HEADER
-----------------------------------------------*/
header { width:100%; }
header.LPFixedHeader,
header.LPLockAtTop.locked { position: fixed; left:0; top:0; width:100%; z-index:1000; }

/*-----------------------------------------------
    FOOTER
-----------------------------------------------*/
footer { visibility:hidden; }
/* footer.on { visibility:visible; } */
footer.adjusted { position:absolute; left:0; bottom:0; width:100%; visibility:visible; }

/*-----------------------------------------------
    INPUT関連
-----------------------------------------------*/
input, textarea, select, button, .LPButton { font-size:15px; line-height:24px; height:48px; padding:12px; border:1px solid #ccc; color:#444; }
input, textarea, button { -webkit-appearance:none; -moz-appearance:none; outline:none; appearance:none; }
/* input */
input { margin-right:0.5em; }
/* radio */
input[type=radio] { width:24px; height:24px; padding:0; position:relative; border-radius:50%; vertical-align:text-bottom; }
input[type=radio]:checked::before { content:''; position:absolute; left:3px; top:3px; width:16px; height:16px; border-radius:50%; background-color:#444; }
/* checkbox */
input[type=checkbox] { width:24px; height:24px; padding:0; position:relative; vertical-align:text-bottom; }
/* input[type=checkbox]:checked::before { content:'✓'; position:absolute; left:-2px; top:0px; font-size:2em; color:#444; } */
input[type=checkbox]:checked::before { content:''; position:absolute; width:12px; height:24px; left:10px; top:18px; border:3px solid #444; border-right:none; border-bottom:none; transform:rotate(-135deg); transform-origin:left top; }
/* textarea */
textarea { width:100%; height:10em; }
/* button */
button, .LPButton { display:inline-flex; justify-content:center; align-items:center; line-height:1; background-color:#fff; border-radius:4px; height:32px; padding:0; }
button > *, .LPButton > * { display:flex; justify-content:center; align-items:center; width:100%; height:100%; padding-left:12px; padding-right:12px; }
/* file select */
input[type=file] { border:none; height:auto; padding:0; }
/* フォーカス */
input:not([type=file]):focus, textarea:focus, select:focus { border-color:#4373fc; box-shadow:0 0 8px rgba(67,115,252,0.2); }
/* プレースホルダー */
input::placeholder, textarea::placeholder { color:#acacac; } 

@media only screen and (max-width:768px) {
    input[type=checkbox] { width:20px; height:20px; }
    input[type=checkbox]:checked::before { width:10px; height:20px; left:8px; top:14px; }
}

/*-----------------------------------------------
    SELECT
-----------------------------------------------*/
.LPSelect { display:inline-block; position:relative; white-space:nowrap; }
.LPSelect select { padding-right:40px; width:100%; -webkit-appearance:none; -moz-appearance:none; outline:none; appearance:none; background-color:#fff; }
.LPSelect::before,
.LPSelect::after { content:''; pointer-events:none; position:absolute; right:20px; top:calc(50% - 2px); width:1px; height:10px; background-color:#444; }
.LPSelect::before { transform:translateY(-50%) rotate(45deg); transform-origin:bottom; }
.LPSelect::after  { transform:translateY(-50%) rotate(-45deg); transform-origin:bottom; }

/*-----------------------------------------------
    ボタン
-----------------------------------------------*/
.LPButtons { display:flex; justify-content:center; align-items:flex-start; }
.LPButtons .LPButton, .LPButtons button, .LPButton { width:240px; height:60px; }
@media only screen and (max-width:768px) {
    .LPButton { width:100%; }
}


/*==========================================================

    ポップアップメニュー (基本はモバイル用)

==========================================================*/
/* メニューアイコン */
.LPMobileMenuButton { display:none; position:fixed; right:0; top:0; width:60px; height:60px; z-index:1001; user-select:none; } /* z-indexはheaderのz-index値+1にする */
.LPMobileMenuButton i { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:24px; height:2px; background-color:#111; transition:all 0.35s; }
.LPMobileMenuButton i::before { content:''; position:absolute; left:0; top:-8px; width:24px; height:2px; background-color:#111; transition:all 0.35s; }
.LPMobileMenuButton i::after  { content:''; position:absolute; left:0; top:8px; width:24px; height:2px; background-color:#111; transition:all 0.35s; }
.LPMobileMenuOpened .LPMobileMenu { opacity:1; pointer-events:all; }
.LPMobileMenuOpened .LPMobileMenuButton i { background-color:transparent; }
.LPMobileMenuOpened .LPMobileMenuButton i::before { top:0; transform:rotate(45deg); }
.LPMobileMenuOpened .LPMobileMenuButton i::after { top:0; transform:rotate(-45deg); }
@media only screen and (min-width:769px) { /* HOVER */
    .LPMobileMenuButton:hover { cursor:pointer; }
}
@media only screen and (max-width:768px) { /* MOBILE */
    .LPMobileMenuButton { display:block; position:fixed; right:0; top:0; width:60px; height:60px; z-index:1001; } /* z-indexはheaderのz-index値+1にする */
    .LPMobileMenuButton i { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:24px; height:2px; background-color:#111; transition:all 0.35s; }
    .LPMobileMenuButton i::before { content:''; position:absolute; left:0; top:-8px; width:24px; height:2px; background-color:#111; transition:all 0.35s; }
    .LPMobileMenuButton i::after  { content:''; position:absolute; left:0; top:8px; width:24px; height:2px; background-color:#111; transition:all 0.35s; }
    .LPMobileMenuOpened .LPMobileMenu { opacity:1; pointer-events:all; }
    .LPMobileMenuOpened .LPMobileMenuButton i { background-color:transparent; }
    .LPMobileMenuOpened .LPMobileMenuButton i::before { top:0; transform:rotate(45deg); }
    .LPMobileMenuOpened .LPMobileMenuButton i::after { top:0; transform:rotate(-45deg); }
}
/* メニュー */
.LPMobileMenu { position:fixed; pointer-events:none; opacity:0; left:0; top:0; z-index:999; width:100%; height:100%; pointer-events:none; transition:all 0.35s; overflow-y:auto; padding-bottom:60px; }
.LPMobileMenuOpened .LPMobileMenu { pointer-events:auto; opacity:1; }
@media only screen and (max-width:768px) { /* MOBILE */
}

/*==========================================================

    ホバー集

==========================================================*/
@media only screen and (min-width:769px) {	/* hover */
    .LPHover { transition:opacity 0.35s; }
    .LPHover:hover { opacity:0.7; cursor:pointer; }
    
    .LPHoverUp { transition:all 0.35s; }
    .LPHoverUp:hover { transform:translateY(-5px); filter:drop-shadow(5px 5px 5px rgba(0,0,0,0.4)); cursor:pointer; }

    .LPHoverZoomImage img { transition:all 0.35s; }
    .LPHoverZoomImage:hover img { transform:scale(1.1); cursor:pointer; }

    .LPHoverBottom2px { display:inline-block; border-bottom:2px solid transparent; padding-top:2px; transition:all 0.2s; }
    .LPHoverBottom2px:hover { border-color:#222; cursor:pointer; }

    .LPHoverBlackBg { transition:all 0.2s; }
    .LPHoverBlackBg:hover { background-color:#444 !important; color:#fff !important; opacity:1; cursor:pointer; }

    .LPHoverYellowBg { transition:all 0.35s; }
    .LPHoverYellowBg:hover { background-color:#ff4 !important; color:#111 !important; opacity:1; cursor:pointer; }
    
    .LPHoverGrayScale { transition:all 0.35s; }
    .LPHoverGrayScale:hover { filter:grayscale(); cursor:pointer; }
}


/*==========================================================

    インデックス表示

==========================================================*/
.LPIndexs { text-align:left; }
.LPIndexs > * { overflow:hidden; display:flex; align-items:flex-start; }
.LPIndexs > *~* { margin-top:20px; }
.LPIndexs > * > *:nth-child(1) { width:200px; font-size:15px; line-height:24px; font-weight:500; }
.LPIndexs > * > *~* { width:calc(100% - 200px); font-size:16px; line-height:24px; }
.LPIndexs.short > * > *:nth-child(1) { width:120px; }
.LPIndexs.short > * > *~* { width:calc(100% - 120px); }
.LPIndexs.middle > * > *:nth-child(1) { width:160px; }
.LPIndexs.middle > * > *~* { width:calc(100% - 160px); }
@media only screen and (max-width:768px) {      /* MOBILE */
    .LPIndexs > * > *:nth-child(1) { font-size:14px; }
    .LPIndexs > * > *~* { width:calc(100% - 200px); font-size:15px; line-height:24px; }
    .LPIndexs.noIndexSp > * { overflow:hidden; display:block; }
    .LPIndexs.noIndexSp > * > *:nth-child(1) { width:auto; font-size:15px; line-height:24px; font-weight:500; }
    .LPIndexs.noIndexSp > * > *~* { width:auto; font-size:15px; line-height:22px; }
    .LPIndexs.noIndexSp.short > * > *:nth-child(1) { width:auto; }
    .LPIndexs.noIndexSp.short > * > *~* { width:auto; }
}

/*==========================================================

	トースト

==========================================================*/
.LPToast { position:fixed; left:50%; transform:translateX(-50%); opacity:0; pointer-events:none; }
.LPToast > p { min-height:48px; padding:12px 20px; font-size:16px; line-height:24px; border-radius:24px; background-color:rgba(0,0,0,0.75); color:#fff; min-width:320px; }

/*==========================================================

    スムーズスクロール

==========================================================*/
body.LPSmoothScroll main { position:fixed; left:0; top:0; }
body.LPSmoothScroll main.smoothing { transition:transform 0.5s cubic-bezier(.11,.57,.22,.99); }
@media only screen and (max-width:768px) {      /* MOBILE */
    body.LPSmoothScroll main { position:absolute; transition:none; }
}

/*==========================================================

    スクロールエフェクト

==========================================================*/
/* フェードイン */
.LPEffect.fadeIn { opacity:0; }
.LPEffect.fadeIn.in { transition:opacity 1.2s cubic-bezier(.55,.07,.52,.95); opacity:1; }
/* フェードアップ */
.LPEffect.fadeUp { opacity:0; transform:translateY(60px); }
.LPEffect.fadeUp.in { transition:opacity 1.2s, transform 1.6s; opacity:1; transform:translateY(0); }
/* フェードライト */
.LPEffect.fadeRight { opacity:0; transform:translateX(-60px); }
.LPEffect.fadeRight.in { transition:opacity 1.6s, transform 1.6s; opacity:1; transform:translateX(0); }
/* ロールアップ */
.LPEffect.rollUp {  overflow:hidden; }
.LPEffect.rollUp > * { transform:translateY(100%); }
.LPEffect.rollUp.in > * { transition:transform 1.6s cubic-bezier(.56,.25,.19,.94); transform:translateY(0); }
/* ライトイン */
.LPEffect.rightIn { transform:translateX(-100%); }
.LPEffect.rightIn.in { transition:transform 1.6s cubic-bezier(.41,.01,0,1); transform:translateX(0); }
/* 多重スクロール */
.LPEffect.perspectiveScroll { transition:transform 1s cubic-bezier(.02,.43,.43,1); }
/* 複数のコンテンツを順番にフェードイン */
.LPEffect.multiDelayFadeIn > * { opacity:0; }
.LPEffect.multiDelayFadeIn.in > * { opacity:1; transition:opacity 1s; }
/* フェードイン + ズームアウト */
.LPEffect.fadeZoomOut { opacity:0; }
.LPEffect.fadeZoomOut.in { transition:opacity 1.2s cubic-bezier(.55,.07,.52,.95), transform 5s linear; opacity:1; transform:scale(1.1); }

/* 重複指定の際の再設定 */
.LPEffect.in.perspectiveScroll.fadeUp { transition:opacity 1.6s, transform 1.6s; }

/*==========================================================

    便利クラス

==========================================================*/

/*	テキストアライン
--------------------------------------------*/
.taLeft { text-align:left; }
.taRight { text-align:right; }
.taCenter { text-align:center; }
@media only screen and (max-width:768px) {      /* MOBILE */
    .taLeftSp { text-align:left; }
    .taRightSp { text-align:right; }
    .taCenterSp { text-align:center; }
}

/*	フォントスタイル
--------------------------------------------*/
.fsItalic { font-style:italic; }
.fsNormal { font-style:normal; }

/*  OVERFLOW
--------------------------------------------*/
.ofHidden { overflow:hidden; }
.ofVisible { overflow:visible; }

/*	flex
--------------------------------------------*/
.flexColumn { display:flex; flex-direction:column; }
.flexCenter { display:flex; justify-content:center; align-items:center; }
.flexLeft { display:flex; justify-content:flex-start; align-items:center; }
.flexRighgt { display:flex; justify-content:flex-end; align-items:center; }
.flexTop { display:flex; justify-content:center; align-items:flex-start; }
.flexBottom { display:flex; justify-content:center; align-items:flex-end; }
.flexTopLeft { display:flex; justify-content:flex-start; align-items:flex-start; }
.flexTopRight { display:flex; justify-content:flex-end; align-items:flex-start; }
.flexBottomLeft { display:flex; justify-content:flex-end; align-items:flex-start; }
.flexBottomRight { display:flex; justify-content:flex-start; align-items:flex-end; }

/*	figure
--------------------------------------------*/
.fixedRatio { padding-top:100%; overflow:hidden; }
.fixedRatio > * { position:absolute; left:0; top:0; width:100%; height:100%; }
.fixedRatio > img { object-fit:cover; font-family:'object-fit: cover;'; /*IE対策*/ }
.fixedRatio > img.noFixed { position:relative; left:auto; top:auto; width:auto; height:auto; }
.fixedRatio > img.contain { object-fit:contain; font-family:'object-fit: contain;'; /*IE対策*/ }
.fixedRatio.ratio2by3 { padding-top:calc(2 / 3 * 100%); }
.fixedRatio.ratio3by2 { padding-top:calc(3 / 2 * 100%); }
.fixedRatio.ratio3by4 { padding-top:calc(3 / 4 * 100%); }
.fixedRatio.ratio4by3 { padding-top:calc(4 / 3 * 100%); }
.fixedRatio.ratio5by4 { padding-top:calc(5 / 4 * 100%); }

.absoluteCenter { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
.absoluteLeft { position:absolute; left:0; top:50%; transform:translateY(-50%); }
.absoluteRight { position:absolute; right:0; top:50%; transform:translateY(-50%); }
.absoluteTop { position:absolute; left:50%; top:0; transform:translateX(-50%); }
.absoluteBottom { position:absolute; left:50%; bottom:0; transform:translateX(-50%); }


/*  フォントの太さ
--------------------------------------------*/
.fwLight { font-weight:200; }
.fwNormal { font-weight:400; }
.fwMedium, .fwMedium input::placeholder, .fwMedium textarea::placeholder, .fwMedium select, .fwMedium option,
.fwMedium h1,.fwMedium h2,.fwMedium h3,.fwMedium h4,.fwMedium h5,.fwMedium h6 { font-weight:500; }
.fwSemiBold, .fwSemiBold input::placeholder, .fwSemiBold textarea::placeholder, .fwSemiBold select, .fwSemiBold option,
.fwSemiBold h1,.fwSemiBold h2,.fwSemiBold h3,.fwSemiBold h4,.fwSemiBold h5,.fwSemiBold h6 { font-weight:600; }
.fwBold { font-weight:700; }
.fwBlack { font-weight:900; }
@media only screen and (max-width:768px) {      /* MOBILE */
    .fwLightSp { font-weight:200; }
    .fwNormalSp { font-weight:400; }
    .fwMediumSp { font-weight:500; }
    .fwSemiBoldSp { font-weight:600; }
    .fwBoldSp { font-weight:700; }
    .fwBlackSp { font-weight:900; }
}

/*  カラー
--------------------------------------------*/
.colorRed { color:#f00; }
.colorBlue { color:#00f; }
.colorGreen { color:#0f0; }
.colorBlack { color:#111; }
.colorWhite { color:#fff; }

/*	親要素と同じ大きさに
--------------------------------------------*/
.adjustFull { position:absolute; left:0; top:0; width:100%; height:100%; }
.adjustFixedFull { position:fixed; left:0; top:0; width:100%; height:100%; }
.transformCenter { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }

/*	ブロックをセンタリング
--------------------------------------------*/
.centerMargin { margin-left:auto; margin-right:auto; }

/*	PC, TB, SP の表示切り替え
--------------------------------------------*/
.tb:not(.pc), .sp:not(.pc) { display:none; }
@media only screen and (max-width:960px) {
	.tb, .tb:not(.pc) { display:block; }
	br.tb, span.tb, img.tb { display:inline; }
}
@media only screen and (max-width:768px) { /* MOBILE */
	.pc:not(.sp) { display:none; }
	.tb:not(.sp) { display:none; }
	.sp, .sp:not(.pc) { display:block; }
    .spFlex { display:flex; }
	br.sp, span.sp, img.sp, br.sp:not(.pc), span.sp:not(.pc), img.sp:not(.pc), br.sp:not(.tb), span.sp:not(.tb), img.sp:not(.tb) { display:inline; }
}

/*  選択不可
--------------------------------------------*/
.unselect { user-select:none; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; }
.undrag {  user-drag:none; -webkit-user-drag:none; }

/*  注釈
--------------------------------------------*/
.LPDots, .LPDot, .LPNotes, .LPNote { font-size:14px; line-height:1.4em; text-align:left; }
.LPNotes > *, .LPNote { padding-left:1.1em; }
.LPNotes > *::before, .LPNote::before { content:'※'; position:absolute; left:0; }
.LPDots > *, .LPDot { padding-left:1.1em; }
.LPDots > *::before, .LPDot::before { content:'・'; position:absolute; left:0; }
@media only screen and (max-width:768px) { /* MOBILE */
}

/*  注釈
--------------------------------------------*/
.LPCenterInLeft { text-align:center; }
.LPCenterInLeft > * { display:inline-block; text-align:left; }

/*==========================================================

    WordPress記事表示

==========================================================*/
.LPWPContent .title { font-size:24px; line-height:1.5em; text-align:left; font-weight:500; }
.LPWPContent .date { font-size:16px; line-height:1.5em; text-align:right; opacity:0.8; margin-top:20px; }
.LPWPContent .content { font-size:17px; line-height:1.6em; text-align:left; margin-top:40px; letter-spacing:0.075em; }
.LPWPContent .content p~p { margin-top:0.8em; }
.LPWPContent .content p a { color:#ff8e1f; }
.LPWPContent .pager { display:flex; justify-content:space-between; font-size:16px; line-height:40px; min-height:40px; margin-top:80px; }
.LPWPContent .pager > .back { position:absolute; left:50%; transform:translateX(-50%); width:160px; height:40px; border:1px solid #666; line-height:1; }
.LPWPContent .pager > .back > * { display:flex; width:100%; height:100%; }


/*==========================================================

    ドラッグによる並び替え

    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js"></script>

==========================================================*/
.LPDragChangeOrder .ui-sortable-helper { z-index:100; background-color:#fff; }


