/*
Theme Name: Utashima Atsushi Official
Version: 1.0
Template: lightning
*/

:root{
	--font_serif: "Shippori Mincho", serif;
	--color_main: #333333;
}

/***********************************
 * 共通
************************************/
body{letter-spacing: 0.08em; font-family: "Noto Sans JP", sans-serif; font-size: 14px; color: var(--color_main);}
body p{line-height: 2.2;}
.headeline-h2{font-family: var(--font_serif); font-size: 2em; letter-spacing: 0.15em;}
.headeline-h3{margin-bottom: 1.571em !important; font-family: var(--font_serif); font-size: 1.5em; letter-spacing: 0.15em;}
hr.wp-block-separator{width: 18%; border-color: var(--color_main); border-width: 1px;}
li a, p a{text-decoration: none;}
a.btn{display: inline-block; padding: 1.429em 4.143em 1.429em 1.286em; border-bottom: 1px solid var(--color_main); font-family: var(--font_serif); position: relative;}
a.btn::after{content: ""; background: url('./img/arrow.svg') no-repeat; width: 22px; height: 8px; position: absolute; top: 53%; right: 0.7em; transform: translatey(-50%); transition: 0.3s;}
a.btn:hover::after{right: 0em;}
a.link{color: var(--color_main); border-bottom: 1px solid var(--color_main); transition: 0.3s;}
a.link:hover{border: none;}
a.link-arrow{color: var(--color_main); padding-right: 2.5em; position: relative;}
a.link-arrow::after{content: ""; background: url('./img/arrow.svg') no-repeat; width: 22px; height: 8px; position: absolute; top: 53%; right: 0; transform: translatey(-50%); transition: 0.3s;}
a.link-arrow:hover::after{right: -0.7em;}

.my-table{border: none; border-bottom: 1px solid var(--wp--preset--color--vk-color-primary);}
.my-table th{width: 15%; border: none; border-top: 1px solid var(--wp--preset--color--vk-color-primary); padding: 1em 0; text-align: left; vertical-align: top; font-weight: 400; letter-spacing: 0.15em;}
.my-table td{width: 85%; border: none; border-top: 1px solid var(--wp--preset--color--vk-color-primary); padding: 1em 0 1em 1em; text-align: left; vertical-align: top; font-weight: 400; line-height: 2.2; letter-spacing: 0.08em;}
.my-table td ul{margin: 0 0 1em;}
.my-table td ul li{margin: 0 0 0.75em; line-height: 1.5;}

/***********************************
 * ヘッダー
************************************/
.site-header,
.site-header--layout--nav-float .site-header-container{min-height: 100px; align-items: center;}
.scrolled .site-header,
.scrolled .site-header--layout--nav-float .site-header-container{min-height: 0;}
.site-header--layout--nav-float .site-header-logo{font-size: 16px; font-family: var(--font_serif);}

/***********************************
 * FV
************************************/
.ltg-slide-text-set{/*background-color: rgb(223, 230, 188, 1); padding: 1em 0 0.4em;*/ top: 75%; font-family: var(--font_serif); letter-spacing: 0.15em;}
.ltg-slide-text-title{font-weight: 400; letter-spacing: 0.1em; line-height: 1.7;}
.ltg-slide-text-title+.ltg-slide-text-caption{margin-top: 1.5rem;}
.ltg-slide picture img{width: 100%; object-fit: cover; object-position: 50% 40%; aspect-ratio: 1440 / 600;}

/***********************************
 * FV以下
************************************/
.profile-box{padding-bottom: 1.8em; margin-bottom: 1.8em !important; position: relative;}
.profile-box::before{content: ""; width: 11.6%; height: 1px; background-color: var(--color_main); position: absolute; bottom: 0; left: 0;}
.profile-box p{margin: 0; padding: 0;}
.profile-name{font-size: 18px;}

.my-list{margin-bottom: 4.5em;}
.my-list_item{padding: 0.5em 0.6em; font-family: var(--font_serif); font-size: 16px;}
.my-list_item p{line-height: 1.5; font-weight: 500;}
.my-list_detail ul{margin: 0; padding: 0; list-style: none;}
.my-list_detail ul li{margin-top: 0.75em; margin-bottom: 0.75em;}
.my-list_symptom{font-size: 13px;}
.symptom-title{display: inline-block; font-size: 14px; font-family: var(--font_serif); font-weight: 500; position: relative;}
.symptom-title::after{content: ""; width: 60%; height: 1px; background-color: var(--wp--preset--color--vk-color-primary); position: absolute; top: 50%; left: 110%; transform: translatey(-50%);}
.symptom-title p{margin-bottom: 0;}

.message-title{font-size: 18px; font-weight: bold; font-family: var(--font_serif);}

.yt-block{width: 80%; margin-top: 44px;}
.yt-block iframe{width: 100%; height: auto; object-fit: cover; aspect-ratio: 16 / 9;}

.hos-img{width: 100%;}
.hos-img img{width: 100%; object-fit: cover; aspect-ratio: 530 / 340; border-radius: 10px; margin: 0 auto 2em;}

.smb-step__item__number{background-color: var(--wp--preset--color--vk-color-primary); color: var(--color_main); font-weight: bold; font-size: 16px; font-family: var(--font_serif);}
.smb-step__item__title{border: none; color: var(--color_main); font-size: 16px; font-family: var(--font_serif); font-weight: 500;}
.smb-step__item__title::after{display: none;}

.snow-monkey-form{width: 66%; margin: 0 auto;}
.smf-form{margin-bottom: 50px;}
.smf-item__label__text{font-family: var(--font_serif); line-height: 2.2; letter-spacing: 0.08em;}
.smf-form .smf-text-control__control,
.smf-form .smf-textarea-control__control{background-color: var(--wp--preset--color--vk-color-primary); border: none; font-family: var(--font_serif); font-size: 14px; line-height: 2.2; letter-spacing: 0.08em;}
.smf-action{text-align: center;}
.smf-action .smf-button-control__control{background-color: transparent; background-image: none; border-radius: 0; padding: 1.429em 4.143em 1.429em 1.286em; border: none; border-bottom: 1px solid var(--color_main); font-family: var(--font_serif); font-weight: bold; letter-spacing: 0.08em; position: relative;}
.smf-action .smf-button-control__control::after{content: ""; background: url('./img/arrow.svg') no-repeat; width: 22px; height: 8px; position: absolute; top: 53%; right: 0.7em; transform: translatey(-50%); transition: 0.3s;}
.smf-action .smf-button-control__control:hover::after{right: 0em;}
.snow-monkey-form[data-screen="complete"]{background-color: var(--wp--preset--color--vk-color-primary); margin-top: 5em; padding: 3em;}

/***********************************
 * フッター
************************************/
.site-footer{border: none;}
.widget_block:has(.footer-text){margin-bottom: 0;}
.footer-text{font-size: 18px; font-family: var(--font_serif); font-weight: bold;}
p.footer-text{margin-bottom: 0;}
.footer-icon{text-align: center; font-size: 21px;}
.footer-icon a{color: var(--color_main);}
.footer-copyright{margin: 2em 0 0.5em; text-align: center; font-family: var(--font_serif);}
.footer-copyright p{margin-bottom: 0;}

/***********************************
 * レスポンシブ
************************************/
@media screen and (max-width: 992px) {
	.site-header,
	.site-header--layout--nav-float .site-header-container{min-height: 0;}
	.site-footer .row{flex-direction: column; align-items: center;}
	.yt-block{width: 100%;}
}
@media screen and (max-width: 768px) {
	.site-header{height: 46px; display: flex; align-items: center; justify-content: center;}
	.snow-monkey-form{width: 100%;}
}
@media screen and (max-width: 480px) {
	.ltg-slide picture img{aspect-ratio: 1 / 1.5;}
	.ltg-slide-text-title{font-size: 6.4vw;}
	.headeline-h2{font-size: 1.5em;}
	.headeline-h3{font-size: 1.2em;}
	.profile-name{font-size: 1.1em;}
}