/*
Theme Name: classicmode
Theme URI: https://terastella.com/originaltheme/
Author: 
Author URI: https://terastella.com/
Description: 
Requires at least: 6.0
Tested up to: 6.2.2
Requires PHP: 5.7
Version: 0.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: classicmode
Tags: 
*/

/*引用*/

blockquote{
    position:relative;
    border-left:3px solid #a5c9c1;
    padding-left:10px;
}
blockquote:before{
    position:absolute;
    font-family:'FontAwesome';
    content:'\f10d';
    font-size: 20px;
    color:#a5c9c1;
}
blockquote p{
    position:relative;
    padding-left:30px;
}
blockquote cite{
    display: block;
    font-size:0.8rem;
    color:#a5c9c1;
    text-align:right;
}



.akismet_comment_form_privacy_notice{
	font-size: 0.8em;
}

/*　投稿日：時計アイコン */
.wp-block-post-date.is-style-clock-icon::before{
    content: url(assets/images/clock-regular.svg);
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    margin-right: 0.4em;
    font-size: 1.25em;
    opacity: 0.3;
}

/*くっきりとした影を重ねた見出し*/
.title_zenhan, .is-style-title_zenhan {
    border: 2px solid #BAA365;
    box-shadow: 5px 5px #BAA365;
    color:#333;/*文字色（黒）*/
    padding: 10px;
}


.title_kouhan {
    border: 2px solid #BAA365;
    box-shadow: 5px 5px #BAA365;
    color:#333;/*文字色（黒）*/
    padding: 10px;
}

/*先頭にチェック*/
.title_member, .is-style-title_member{
    display: flex;
    align-items: baseline;
    column-gap: 8px;
    color: #333;
    padding-left:0;
}

.title_member::before, .is-style-title_member::before {
    width: 0.8em;
    height: 0.4em;
    border-bottom: 4px solid #a5c9c1;
    border-left: 4px solid #a5c9c1;
    transform: rotate(-45deg) translate(2px, -2px);
    content: '';
}



.title_kansou {
    display: flex;
    align-items: baseline;
    column-gap: 8px;
    color: #333;
    padding-left:0;
}

.title_kansou::before {
    width: 0.8em;
    height: 0.4em;
    border-bottom: 4px solid #BAA365;
    border-left: 4px solid #BAA365;
    transform: rotate(-45deg) translate(2px, -2px);
    content: '';
}

/*先頭にふき出し*/

.title_interview, .is-style-interview {
  position: relative;/*相対位置*/
  padding-left: 1.2em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
}


.title_interview:before, .is-style-interview:before {
  font-family: "Font Awesome 5 Free";
  content: "\f075";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0;/*アイコンの位置*/
  color: #C0C0C0; /*アイコン色*/
}

   
/*外部リンク*/

.is-style-gaibulink{
  position: relative;/*相対位置*/
  padding-left: 3em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  margin: 2em;
  margin-left: 4em;
}

.is-style-gaibulink a:before{
  font-family: "Font Awesome 5 Free";
  content: "\f0c1";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 1.2em;/*アイコンの位置*/
  top: 0;/*アイコンの位置*/
  color: #C0C0C0; /*アイコン色*/
	
}

/*先頭に♪*/
.is-style-kyokumei:before {
  content: '♪';
  margin-right: 8px;
}

/*プログラムエリア　手書きノート風*/
.proguram_area, .is-style-program{
	margin: 2em auto;
	position: relative;
	background: #eee; /*背景色*/
	padding: 3em 1em 2em; /*内側余白（上・左右・下）*/
}

.proguram_area::before, .is-style-program::before {
	position: absolute;
	content: "";
	width: 95%;
	height: 10px;
	top: 0.5em;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	border-top: dotted 10px #fff; /*ドットの形・大きさ・色*/
}

.proguram_area hr, .is-style-program hr{
	color: #FFFFFF;
	height: 1px;
	padding: 0px;
	margin: 0px 0px 5px 0px;
}
.proguram_area p, .is-style-program p{
	padding: 5px;
	margin: 0px;
}

/*一部だけ線の色を変える 曲エリア*/
.kyoku_area, .is-style-kyoku {
	margin: 2em auto;
	padding:2em;/*内側余白*/
	border: 2px solid #eee;	
	position: relative;
	z-index: 0;
}
.kyoku_area:before, .is-style-kyoku:before {
	border-top:2px solid #c6d4c6;
	border-left:2px solid #c6d4c6;
	content: '';
	display: block;
	position: absolute;
	top: -2px;
	left: -2px;
	width: 20px;
	height: 20px;
	z-index: 1;
}

/*吹き出し*/
.fukidashi {
    display: flex;
    align-items: center;
    position: relative;
    max-width: 300px;
    margin-left: 15px;
    padding: .8em 1.2em;
    border: 3px solid #bfbfbf;
    border-radius: 5px;
    background-color: #fff;
    color: #333333;
}

.fukidashi::before,
.fukidashi::after {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 30px;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    content: '';
}

.fukidashi::before {
    background-color: #bfbfbf;
}

.fukidashi::after {
    left: -11px;
    background-color: #fff;
}

p.is-style-fukidashi {
    display: flex;
    align-items: center;
    position: relative;
    margin-left: 15px;
    padding: .8em 1.2em;
    border: 3px solid #bfbfbf;
    border-radius: 5px;
    background-color: #fff;
    color: #333333;
}

p.is-style-fukidashi::before,
p.is-style-fukidashi::after {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 30px;
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
    content: '';
}

p.is-style-fukidashi::before {
    background-color: #bfbfbf;
}

p.is-style-fukidashi::after {
    left: -11px;
    background-color: #fff;
}

/*背景色をつけて角を丸くする　感想*/
.kansou_area, .is-style-kansou{
	margin: 2em auto;
	padding:2em;/*内側余白*/
	border-radius:30px;/*丸みを調整*/
	background-color:#fff8e5;
	font-size: 95%;
}

/*方眼紙風 備考エリア*/
.bikou_area, .is-style-bikou{
	margin: 2em auto;
	padding:2em;/*内側余白*/
	background-image: linear-gradient(0deg, transparent 19px, #ccc 20px),linear-gradient(90deg,  transparent 19px, #ccc 20px);
	background-size: 20px 20px;
}

/*SNSシェア*/
.sns__container {
    display: flex;
}

.sns__container a {
    width: 100%;
    text-align: center;
    color: #fff;
    padding: 0.5rem 0;
}

.sns__container a:hover {
    opacity: 0.6;
}

.sns__twitter {
    background: #55acee;
}

.sns__facebook {
    background: #3b5998;
}

.sns__pocket {
    background: #ef3f56;
}

.sns__line {
    background: #1dcd00;
}

.sns__hatena {
    background: #00a5de;
}