@charset "utf-8";

/* Cascading Style Sheetsを記述する */

/* 以下を毎回記載してください
 * 担当：、、、　日付：、、、
 * ステータス：実験 or 完了
 * 目的：、、、
 */

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　画像に文字を縦書きで載せる＋自動ズーム
 * 1/2 土台と画像とオーバーレイ 
 * とくに、min-heightは上書きのため必須
 */
.height50vh {
	min-height: 55vh !important;
	height: 55vh !important;
}

.site-logo-image {
}

.height50vh, .height50vh div, .height50vh span {
	height: 55vh !important;
	width: 100% !important;
}

.height50vh img {
	height: 55vh !important;
	width: 100% !important;
	object-fit: cover;
}
/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/7
 * ステータス　実験
 * 目的　もし整形すみテキスト(見出しでなく）の場合、背景と枠を非表示に指定する必要がある
 */

.height50vh pre {
	background: none;
	border: none;
}
/*
 * 目的　画像に文字を縦書きで載せる＋自動ズーム
 * 2/2 インナーコンテンツ
 */
.height50vh .wp-block-cover__inner-container {
	position: absolute;
	top: 0;
	height: 55vh !important;
	font-size: min(4vw, 21px);
	color: blue !important;
	text-shadow: 1px 1px 0 lightgreen; 
	writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　ヘッダー、ナビメニュー、モバイルナビメニューを非表示にする
 * 1/2 土台と画像とオーバーレイ 
 * 対象ページ　ホーム＋実験用
.home header, .home #navi, .home .slicknav_menu {
    display: none;
}

.page-id-713 header, .page-id-713 #navi, .page-id-713 .slicknav_menu {
    display: none;
}
 */

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　リンクの下線を消去する
 */
.height50vh a {
	padding: 4px;
}

.height50vh pre {
	margin: 4px;
}

.height50vh a {
	color: lightcoral !important;
	text-shadow: 1px 1px 0 lightcyan; 
	text-decoration: none;
}

.height50vh a:hover {
	transition: all 0.5s;
  	background: lightgreen;
	border-radius: 15%;
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　画像をズームアウトして表示する
 */

.height50vh {
	opacity: 0;
}

.height50vh.anime1 {
	animation: zoomIn2 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;
}
 
@keyframes zoomIn2 {
  0% {
    transform: scale(1.3);
    opacity: 0;
  }
  100% {
    transform: scale(0.2);
    opacity: 1;
  }
} 

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　画像の説明テキストの高さを固定する
 */

.height50vh-text {
	height: 25vh;
}

body.front-top-page .height50vh-text.anime1 {
	animation: opacityIn2 5s cubic-bezier(0.25, 1, 0.5, 1)  1 forwards;
}

@keyframes opacityIn2 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
} 
/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　ページ名をトップでは非表示に、それ以外センターよせにする
 */

.entry-title {
	text-align: center;
	margin-bottom:75px;
}

.home .entry-title {
	display: none;
}

.archive-title {
	font-size: 130%;
	text-align: center;
	background: white;
	color: #50f0e0;
	border-top   :double 6px #00cccc;
    border-right :dotted 2px #50f0e0;
    border-bottom:solid  3px #50f0e0;
    border-left  :ridge  8px #50f0e0;
	font-style: italic;
	border: black 1px;
	text-shadow: 2px 2px white; 
	width: clamp(80%, 300px, 100%);
	margin: auto;
	margin-bottom: 20px;
}

.entry-title {
	font-size: 130%;
	text-align: cecnter;
	background: white;
	color: #50c0e0;
	text-shadow: 2px 2px lightgreen; 
	border-top   :double 6px #00cccc;
    border-right :dotted 2px #50f0e0;
    border-bottom:solid  3px #50f0e0;
    border-left  :ridge  8px #50f0e0;
	font-style: italic;
	margin-bottom: 10px;
	width: clamp(80%, 300px, 100%);
	margin: auto;
	margin-bottom: 20px;
}

.sns-link {
	margin: 0;
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　SNSメニューは、モバイルのみ
.sns-link {
	display: none;
	visibility: hidden;
	height: 0;
}

@media screen and (max-width: 1055px) {
	.sns-link {
		visibility: visible;
		display: block;
		height: auto;
	}
}
*/

/*
.whitecat-header-text {
	width: 80%;
	text-align: center;
}*/


/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/5
 * ステータス　実験
 * 目的　ページの日付を非表示にする
 */
div.date-tags {
	display: none;
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/10
 * ステータス　実験
 * 目的　記事内の一部画像を画面全幅にする
 */
.full-width-image {
	width: 100vw !important;
	margin: 0 calc(50% - 50vw);
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/10
 * ステータス　実験
 * 目的　Cocoonヘッダーをロゴとメニューを同時表示にする場合、背景画像および高さはCSSで指定する
 */
/* body.front-top-page  */ #header-container {
	background: none;
}

/* body.front-top-page */ #header-container-in {
	background: none !important;
}

/* body.front-top-page header {
	background: none !important;
}*/

/*body.front-top-page  #header-container {
	background-image: url(http://cafelapremiereetoile.com/wp-content/uploads/2023/04/kishset2.jpg);トップページのみヘッダ画像変更可能
}*/

/* 以下3つで、画像をズームさせる、トップページのみの場合、セレクタを変更する */

/*body.front-top-page*/ #header-container {
	transition: all 1s;
	opacity: 0;
}
/*body.front-top-page */ #header-container {
	background: none;
	background: cover;
	background-repeat: no-repeat;
	background-size: 200%, 200px;
	background-position: center 40%;
/*	background-image: url(http://cafelapremiereetoile.com/wp-content/uploads/2023/07/lpepht_header.jpg);*/
	background-image: url(http://cafelapremiereetoile.com/wp-content/uploads/2023/03/S__44449800.jpg);
/*	background-image: url(http://cafelapremiereetoile.com/wp-content/uploads/2023/09/Pudding4-3.-2jpg.jpg);*/
	opacity: 0.4;
}

#header-container.anime2 {
	background-size: 100%, min(30vh, 300px);
	opacity: 0.85;
}

#navi {
	margin-right: 50px;
}

#navi, #navi-in {
	background: none !important;
	height: min(50vh, 200px);
}

body.front-top-page #navi, #navi-in {
	height: min(60vh, 250px);
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/10
 * ステータス　実験
 * 目的　Cocoonメニューない文字を縦書きにする、影もつける
 */
#navi-in ul li {
	writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	text-align: left;
	margin-top: 30px;
	height: min(30vh, 200px);
}

.navi-in > ul .caption-wrap > div {
    width: 30%;
}
/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/10
 * ステータス　実験
 * 目的　Cocoonメニュー、マウスを置いたときの表示
 */
#navi-in li {
	transform: scale(1.1);
}
#navi-in li a {
	padding-top: 10px;
	font-weight: bold;
	color: #40e0d0 !important;
	text-shadow: 2px 2px black; 
	transform: scale(1.1);
}

#navi-in li a:hover {
	/*color: lightblue !important;*/
	text-shadow: 2px 2px white; 
	transform: scale(1.2);
	font-weight: bold;
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/10
 * ステータス　実験
 * 目的　NaviMenuの文字をゆっくり表示する(See JavaScript)
 */
nav.cf {
	box-shadow: none;
	border: none important;
}

#navi-in li a {
	opacity: 0;
}

#navi-in.showup li a {
	opacity: 1;
	transition: all 0.5s;
}

@media screen and (max-width: 834px) {
	#header-container {
		height: 120px;
	}
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/10
 * ステータス　実験
 * 目的　Cocoonメニュー並び方整形
 */

/*
#navi-in ul {
	display: flex;
}*/

#navi-in ul li {
	flex-grow: 0;
	width: 80px;
}

.width-contactform {
	width: min(800px, 65%);
	margin: auto;
}

/* 
 * 担当　Y.Syntarou
 * 日付　2023/4/24
 * ステータス　実験
 * 目的　Font整形
 */

/*
body {
	font-family: Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	font-size: clamp(13px, 1.5vw, 17px) !important;
}

@media screen and (max-width: 834px) {
	body {
		font-size: 13px;
	}
}
*/

.whitecat-pict100 {
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
}

.img-x {
	margin-left: 9px;
}
.img-instagram {
	margin-left: 5px;
}

.search-menu-icon {
	display: none;
}

#navi-menu-open .menu-caption {
	color: #40e0d0;
}

#search-menu-open {
	display: none;
}

#metaslider-id-3509 {
	margin: auto;
}