@CHARSET "utf-8";

/*
Theme Name: e
Author URI: https://kochi-ai.com/
*/

/*---------------------------------------------------------*/
/* General */
/*---------------------------------------------------------*/
body {
    font-family: Helvetica, "游ゴシック",Meiryo, sans-serif, serif,"sans-serif", 'Lucida Grande','Hiragino Kaku Gothic ProN';
    font-size: 17px;
    color: #1a365d;
    padding: 0;
    margin: 0;
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
    position: relative;
    min-height: 100vh;
}

/* 背景画像を疑似要素で設定 */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://images.unsplash.com/photo-1557683316-973673baf926?w=1920&h=1080&fit=crop');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.5; /* この値で背景の薄さを調整（0.1〜1.0） */
    z-index: -1;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

html,body {
     margin: 0;
     padding: 0;
}	

@media (min-width: 1024px) {
    body {
        font-size: 16px; /* 必要に応じて調整 */
    }
}

/* iPadとiPad Pro専用のリセット */
@media only screen and (min-device-width: 768px) and (max-device-width: 1366px) {
  html, body {
    font-size: 17px;
  }
  
  p {
    font-size: 17px;
  }
  
  /* 重要なテキスト要素のサイズも強制的に調整 */
  h1, h2, h3, h4, h5, h6, span, div, li, a {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100% ;
  }
}

	
@media screen and (max-width:760px) {
body {
	font-size: 16px;
}
}

/* 画像属性等 */
img {
	max-width: 100%;
	height: auto;
	-webkit-transition:all 0.25s ease-in-out;
	transition:all 0.25s ease-in-out;
	vertical-align: bottom;
}

figure {
    display: block;
	margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

figcaption {
    display: block;
	padding:5px 0;
}

svg {
    height: auto;
    width: 100%;
}

a {
    color: #1111cc;
	text-decoration: underline;
}
a img {
    border: none;
}
a:hover {
    color: #1111cc;
    text-decoration: none;
}

a:hover img.hoverIMG{
opacity:0.5;
filter:alpha(opacity=50);
-ms-filter: "alpha( opacity=50 )";
}

p {
	font-size: 17px;
}	


div#container {
    margin: 0 auto;
    width: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
	overflow:hidden;
}
@media screen and (max-width:760px) {
div#container {
margin: 10px 0px 0px 0px;
}
}


#header {
    display: block;
	background-color:#fff;
	margin-bottom:0;
	height:100%;
}
@media screen and (max-width:760px) {
#header {
}
}

div#main {
    display:block;
}
@media screen and (max-width:760px) {
div#main {
}	
}

.ie {
    overflow: hidden;
	max-width: 100%;
	min-width: 760px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	height: 100%;
	padding: 0 0 0 0;
}
@media only screen and (max-width : 760px){
.ie {
	max-width:100%;
	min-width: 100%;	
    margin-top: 0px;   
    overflow: hidden;
	padding: 0 10px;
}		
}


.single-ie {
    background-color: #fff;
    overflow: hidden;
	max-width:80%;
	min-width:760px;
	margin: 0px auto;
	margin-top:0px;
	height:100%;
	padding:50px 0 0 0;
}
@media only screen and (max-width : 760px){
.single-ie {
	max-width:100%;
	min-width: 100%;	
    background-color: #fff;
    margin-top: 0px;   
    overflow: hidden;
	padding:0 10px;
}		
}

.category-ie {
    background-color: #fff;
    overflow: hidden;
	max-width:80%;
	min-width:760px;
	margin: 0px auto;
	margin-top:0px;
	height:100%;
	padding:50px 0 0 0;
}
@media only screen and (max-width : 760px){
.category-ie {
	max-width:100%;
	min-width: 100%;	
    background-color: #fff;
    margin-top: 0px;   
    overflow: hidden;
	padding:0 10px;
}		
}

.archive-ie {
    background-color: #fff;
    overflow: hidden;
	max-width:80%;
	min-width:760px;
	margin: 0px auto;
	margin-top:0px;
	height:100%;
	padding:50px 0 0 0;
}
@media only screen and (max-width : 760px){
.archive-ie {
	max-width:100%;
	min-width: 100%;	
    background-color: #fff;
    margin-top: 0px;   
    overflow: hidden;
	padding:0 10px;
}		
}

div#page-content {
    width: 100%;
    padding: 0;
    margin: 0;
    min-height: 100vh;
}
@media screen and (max-width:760px) {
div#page-content {

}
}

div#content {
    width: 70%;
    float: left;
    padding: 0px 0 0 0;
    margin: 0px 10px 10px 10px;
	min-height: 100vh;
}
@media screen and (max-width:760px) {
div#content {
    width: 100%;
    padding: 0;
    margin: 60px 0 0 0;
}
}




/* 基本スタイル */
article.post {
    display: block;
}

/* フロントページ用 */
article.front-page {
    margin: 0; /* フロントページはmarginなし */
    background-color: transparent;
}

/* 内部ページ用 */
article.inner-page {
    margin: 0px 0%;
	padding: 0;
}

/* ページヘッダー部分の調整 */
article.inner-page header {
    margin: 0;
    padding: 0;
}

/* レスポンシブ対応 */
@media only screen and (max-width : 760px) {
    /* 内部ページのみモバイル対応 */
    article.inner-page {
        margin: 0 5px;
    }
    
    /* フロントページのモバイル対応（必要に応じて） */
    article.front-page {
        margin: 0;
    }
}



div#sidebar {
    width: 24%;
    float: right;
    padding: 0 10px;
    margin: 5px;
}
@media screen and (max-width: 760px) {  
div#sidebar {
    width: 100%;
	padding: 0 5px;
    margin: 0 ;
	box-sizing: border-box;
}
}

.clr { clear:both; }

ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 5px;
}


/*---------------------------------------------------------*/
/* Header */
/*---------------------------------------------------------*/
header {
	margin: 0px;
	padding: 0px 10px 0px 10px;
}
@media only screen and (max-width : 760px){
header {
	padding: 0px 0px 0px 0px;
}	
}

h1.top_page {
    margin: 5px 0 0 25px;
}
a.no_underline {
	text-decoration:none;
}

div#site_title_wrapper {
	float:left;
}

h1#site-title {
    font-size: 2.0em;
    margin: 15px 0 5px 0;
    color:#2ea7e0;
}
h1#site-title a {
    color: #2ea7e0;
}
h2#site-description {
    font-size: 1.2em;
    font-weight: bold;
    color: #555555;
    margin: 0 0 10px 0;
}

/* 黄色い背景 - 名前を変更 */
.hachi-title-yellow-bg {
    display: inline-block;
    position: relative;
    margin-bottom: 20px;
	margin-top: 20px;
}

.hachi-title-yellow-bg::before {
    content: "";
    background-image: url('https://leopard-hachi.com/wp-content/uploads/yellow.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 300px;
    height: 150px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/*---------------------------------------------------------*/
/* Article's Header */
/*---------------------------------------------------------*/
h1.single_title {
  position: relative;
  padding: 0.3rem 1.5rem;
  font-size: 30px;
  margin: 30px 0px 30px 0;
}

@media only screen and (max-width : 760px){
h1.single_title {
  position: relative;
  padding: 0.3rem 0.5rem;
  font-size:27px;
}
}	
h2.k {
    background: #0066cc;
    padding: .5em .8em;
    font-size: 24px;
    color: #fff;
    margin: 40px 0 20px 0;
}

h3.k {
    font-size: 22px;
    padding: .6em .5em .3em .8em;
    margin: 2.3em .3em 0em .3em;
    color: #494949;
    background: #f9f9f9;
    border-bottom: solid 3px #eee;
    letter-spacing: 1.5px;
    border-left: solid 6px #0066cc;
}
h3.k:after {
    border-bottom: none;
}

h4.k {
    padding: .3em .7em;
    color: #494949;
    background: transparent;
    border-bottom: solid 3.5px #0066cc;
    font-size: 22px;
    letter-spacing: 1.5px;
    margin: 0.7em .5em 0em .5em;
}	

h1.post_title {
	padding: 0.3em 0.5em 0.3em 0.8em;/*文字周りの余白*/
	color: #494949;/*文字色*/
	background: #f9f9f9;/*背景色*/
	border-left: solid 6px #0066cc;/*左線（実線 太さ 色）*/
	border-bottom: solid 3px #EEEEEE;/*左線（実線 太さ 色）*/
	font-size:24px;
}
@media only screen and (max-width : 760px){
h1.post_title {
	padding: 5px 10px;
}	
}

/* メインタイトル */
.post_title_page-container {
    text-align: center;
    margin: 0 0 50px 0;
    position: relative;
	padding: 0;
}
.post_title_page {
    font-size: 32px;
    font-weight: 600;
    margin: 0;
    padding: 30px 0;
    position: relative;
    z-index: 1;
}
@media screen and (max-width: 760px) {
	.post_title_page-container {
		margin: 0px 0 15px 0;
}
    .post_title_page {
		padding: 0;
    }
}
@media screen and (max-width: 576px) {
    .post_title_page {
        font-size: 24px;
    }
}

h2.post_title {
	font-size: 24px;
	padding: 10px 20px;
	margin: 50px 0 0 0;
	color: #fff;/*文字色*/
	background: #0066cc;/*背景色*/
	border-left: none;/*左線（実線 太さ 色）*/
	border-bottom: none;/*左線（実線 太さ 色）*/
}
@media only screen and (max-width : 760px){
h2.post_title {
	font-size: 22px;
	padding: 10px 20px;
	margin: 30px 0 0 0;
}	
}

p.post-meta {
    color: #555;
    font-size: 1.0em;
    padding: 5px 0 5px 20px;
    margin: 0 0 3px 0;
    text-align: right;
}

h3 {
    display: block;
    font-size: 22px;
    margin-block-start: 2em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

h2.border_yellow {
    display: block;
    font-size: 1.5em;
    margin: 2em 0em 1em 0em;
    font-weight: bold;
    unicode-bidi: isolate;
}

h3.border_yellow {
    display: block;
    font-size: 22px;
    margin: 2em 0em 1em 0em;
    font-weight: bold;
    padding: 0.25em 0.5em 0.25em 0.7em;/*上下 左右の余白*/
    border-left: solid 5px #0066cc;/*左線*/
}
@media screen and (max-width: 760px) {
h3.border_yellow {
    display: block;
    font-size: 22px;
    margin: 2em 0em 1em 0em;
}
}

h4.bubble {
color: #555;
font-size: 1.3rem;
margin-top: 25px;
margin-bottom: 30px;
background-color: #0066cc;
padding: 10px 15px;
border-radius: 8px;
display: inline-block;
position: relative;
font-weight: normal;
letter-spacing: 0.5px;
margin-block-end: 0.5em;
}
        
h4.bubble::after {
content: '';
position: absolute;
left: 15px;
bottom: -10px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #0066cc;
}

h3.double_blue {
	position: relative;
	width: 100%;
	margin: 30px 0px 10px 0px;
	padding: 5px 15px;
	border-bottom: 2px solid #3fa9f5;
	font-size:22px;
}
@media only screen and (max-width : 760px){
h3.double_blue {
	margin-left: 0;
}	
}

h3.double_blue::before {/*疑似要素*/
	position: absolute;
	content: "";
	width: 100%;
	min-height: 100%;
	top: -12px;
	left: 0px;
	border-bottom: 1px solid #3fa9f5;
	padding: 0;
	margin: 8px 0px 0px 0px;
}

h2.orenge,h3.orenge,h4.orenge,h5.orenge {
	padding: 0.3em 0.5em 0.3em 0.8em;/*文字周りの余白*/
	color: #494949;/*文字色*/
	background: #f9f9f9;/*背景色*/
	border-left: solid 6px #0066cc;/*左線（実線 太さ 色）*/
	border-bottom: solid 3px #EEEEEE;/*左線（実線 太さ 色）*/
}

h4 {
	font-size:20px;
    display: block;
    margin-block-start: 1.33em;
    margin-block-end: 1.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

h5 {
    display: block;
    font-size: 18px;
    margin-block-start: 1.67em;
    margin-block-end: 1.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}


h3.course {
  font-size: 30px;
  position: relative;
  overflow: hidden;
  padding: 1rem 2rem 1rem 130px;
  word-break: break-all;
  border-bottom: 3px solid #009245;
  border-radius: 12px 0 0 0;
}

h3.course span {
  font-size: 40px;
  font-size: 3.5rem;
  position: absolute;
  top: 5px;
  left: 0;
  display: block;
  padding: 3px 20px;
  color: #fff;
  border-radius: 10px 20px 0 10px;
  background: #009245;
}

@media only screen and (max-width : 760px){
h3.course {
	font-size: 21px;
	padding: 10px 5px 0px 65px;
}

h3.course span {
	font-size: 27px;
	font-size: 1.7rem;
  top: 5px;
  left: 0;
  padding: 3px 10px;
}
}

/*---------------------------------------------------------*/
/* Article post */
/*---------------------------------------------------------*/
div.post-content {
    padding: 0px 0px 0px 0px;
}
@media only screen and (max-width : 760px){
div.post-content {
    padding: 0px 0px 10px 0px;
}	
}

/*---------------------------------------------------------*/
/* アーカイブ post */
/*---------------------------------------------------------*/
div.archive-content {
    padding: 0;
    height: 100%;
    width: 100%;
    margin: 0;
}


/*---------------------------------------------------------*/
/* カテゴリー post */
/*---------------------------------------------------------*/
div.category-content {
    padding: 0;
	height: 100%;
	width: 100%;
	margin: 0 10px;
}
@media only screen and (max-width : 760px){
div.category-content {
	margin: 0 0px;
}	
}

/* ▼▼▼カテゴリーにあるアイキャッチ画像▼▼▼ */
/* リスト */
.category_01 {
	list-style: none;
	padding: 0;
	margin: 20px 0px;
}
@media only screen and (max-width : 760px){
.category_01 {
	list-style: none;
	padding: 0px;
	margin: 20px 0px;
}	
}

/* h2 */
h2.category_02 {
	font-size: 1.3em;
	padding: 0;
	margin: 5px 0px;
	font-weight:bold;
}


/* 画像 */
.category img {
	padding: 0;
	margin: 5px 20px 5px 10px;
	float:left;
}
@media only screen and (max-width : 760px){
.category img {
	margin: 0px 0px 20px 0px;
}	
}

/* ボックス */
.category {
	width:100%;
	padding: 0.5em 1em 3.5em 1em;
    color: #000;/*文字色*/
	background-color: #FFF;
    border-bottom: solid 1px #C0C0C0;/*線*/
}
@media only screen and (max-width : 760px){
.category {
	padding: 0.5em 1em 2.0em 1em;
}	
}

.category p {
	font-size:16px;
	padding: 0;
	margin: 0px 0px 20px 0px;
}
@media only screen and (max-width : 760px){
.category p {
}
}

.more_link {
	text-decoration:underline;
}	

a:hover.more_link {
	text-decoration:none;
}
/* ▲▲▲カテゴリーにあるアイキャッチ画像▲▲▲ */

/* ▼▼▼アイキャッチ画像の大きさ▼▼▼ */
.l-size {
	width:120px;
	height:auto;
}	
/* ▲▲▲アイキャッチ画像の大きさ▲▲▲ */

h1.cat_title {
    font-size: 1.5em;
	padding: 0.3em 0.5em 0.3em 0.8em;/*文字周りの余白*/
	color: #494949;/*文字色*/
	background: #f9f9f9;/*背景色*/
	border-left: solid 6px #0066cc;/*左線（実線 太さ 色）*/
	border-bottom: solid 3px #EEEEEE;/*左線（実線 太さ 色）*/
    margin: 0.83em 0;
}
@media only screen and (max-width : 760px){
h1.cat_title {
	padding: 5px 10px;
}	
}


/*---------------------------------------------------------*/
/* footer */
/*---------------------------------------------------------*/
/*
==================================================
フッター右寄せ問題の修正
==================================================
*/

#footer {
  text-align: center !important; /* 強制的にセンタリング */
  padding: 0px 0 20px 0;
  margin: 0;
  width: 100%;
  clear: both; /* フロートの影響を除去 */
}

.footer-content {
  background-color: #fff;
  padding: 20px 20px;
}

.foot {
  text-align: center !important;
  margin: 5px auto;
  padding: 0 20px;
  max-width: 1200px;
  font-size: 0.9rem;
  line-height: 1.4;
}

.footer_01 {
  color: #222; /* ゆら・らの赤色 */
  text-decoration: none;
}

.footer_01:hover {
  text-decoration: underline;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
  .foot {
    font-size: 0.8rem;
    padding: 0 15px;
  }
}

#footer .container {
  text-align: center; /* フッター内だけセンタリング */
}


/*
==================================================
フッター3カラム
==================================================
*/
/* フッター */
.footer {
	background-color: #0099cc;
	text-align: left;
	color: #fff;
	padding: 40px;
	margin-top: 0px;
}
        
.footer-top {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	gap: 3rem;
	margin-bottom: 3rem;
}
        
.footer-logo {
	font-size: 1.2rem;
	font-weight: 500;
	margin-bottom: 2rem;
}

/* ロゴ画像のスタイル */
.footer-logo-image {
  margin-bottom: 20px;
  max-width: 200px;
  height: auto;
  display: block;
}
        
.footer-description {
	font-size: 0.9rem;
	margin-bottom: 1.5rem;
	max-width: 400px;
}
        
.footer-social {
	display: flex;
	gap: 1rem;
}
        
.footer-social-link {
	width: 36px;
	height: 36px;
	background-color: #FDF7E8;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1rem;
	color: #0099cc;
	transition: all 0.3s ease;
	text-decoration: none;
}
        
.footer-social-link:hover {
	background-color: var(--primary);
	color: #fff;
}
        
.footer-title {
	font-size: 1.1rem;
	font-weight: 700;
	margin-bottom: 1.5rem;
}
        
.footer-links {
	list-style: none;
}
        
.footer-link {
	margin-bottom: 0.8rem;
	color: #fff;
}
        
.footer-link a {
	text-decoration: none;
	font-size: 0.9rem;
	transition: color 0.3s ease;
	color: #fff;
}
        
.footer-link a:hover {
	text-decoration: underline;
}
        
.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding-top: -2rem;
	text-align: center;
	font-size: 0.85rem;
}
        
        /* レスポンシブデザイン */
        @media (max-width: 992px) {
            .footer-top {
                grid-template-columns: 1fr 1fr;
            }
			
			  .footer-logo {
                text-align: left;
            }
  
            .footer-logo-image {
                text-align: center;
            }
        }
        
        @media (max-width: 768px) {
            .footer-top {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
        }
        
        @media (max-width: 576px) {

        }
@media screen and (max-width: 480px) {
        .contact-container {
            display: block;
        }
        .contact-title {
            font-size: 1.3rem;
        }	
}
@media screen and (max-width: 360px) {
        .social-links {
            gap: 0.4rem;
        }	
        .footer-top {
            display: block;
        }	
	.footer {
    padding: 60px 15px;
        }
}


/* 事業所情報のスタイル */
.footer-contact-info {
    margin: 0rem 0 1.0rem 0;
    padding: 1.5rem 0rem 1.5rem 0rem;
    border-radius: 8px;
    max-width: 400px;
}

.footer-contact-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    padding-bottom: 0.5rem;
}

.footer-contact-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 0.8rem;
    font-size: 0.85rem;
    line-height: 1.4;
}

.footer-contact-item:last-child {
    margin-bottom: 0;
}

.footer-contact-item i {
    width: 16px;
    margin-right: 0.8rem;
    margin-top: 0.1rem;
    flex-shrink: 0;
    color: #FDF7E8;
}

.footer-contact-item span {
    color: #fff;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .footer-contact-info {
        max-width: 100%;
        margin: 1.5rem 0 1rem 0;
        padding: 1rem;
    }
    
    .footer-contact-item {
        font-size: 0.8rem;
    }
    
    .footer-contact-item i {
        margin-right: 0.6rem;
    }
}








/*---------------------------------------------------------*/
/* Sidebar */
/*---------------------------------------------------------*/
.sidebar-wrapper {
	margin:15px 0;
}
.sidebar-title {
	font-size: 22px;
	padding: 6px 0 6px 10px;
	margin: 20px 0 10px 0;
	color: #555;
	border-bottom: solid 1px #ccc;
}
.textwidget {
	padding: 0 0px;
}
#calendar_wrap {
	text-align: center;
}
#calendar_wrap table {
	margin-left: auto;
	margin-right: auto;
}
#calendar_wrap table a {
	text-decoration: underline;
	color: #2ea7e0;
}
#calendar_wrap table a:hover {
	background-color: #2ea7e0;
	color: #fff;
}
.sidebar-wrapper ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.sidebar-wrapper li {
	border-bottom: dotted 1px #0066cc;
	margin:10px 0 5px 0;
}
.sidebar-wrapper li a {
	display: block;
	color: #555;
	padding: 10px 0 10px 8px;
	text-decoration:none;
}
.sidebar-wrapper li a:hover {
    color: #aaaaaa;
}

/* コメント・トラックバック */
div#respond {
	margin:10px;
}
@media only screen and (max-width : 760px){
div#respond {	
	margin:5px;
}	
}

.tback {border: none;}
.tback h2{margin-bottom: 0; padding-bottom: 15px;}
.tback p {margin: 0 0 10px 10px;padding: 0;font-size: 12px; line-height: 1.6em;}
.comments{margin: 10px 0; border: none;}
.comments ul{list-style: none;margin: 0; color:#444; font-size: 100%;}
.comments ul li {margin-bottom: 10px;background: #FFF; padding: 12px;}
.comments ul li.depth-1{border-bottom: 1px dotted #CCC;margin-bottom: 12px;}
.comments ul.children {list-style: none;}
.comments p{padding: 0 10px 5px 20px; text-align: left;}
.comments form p{line-height: 1.8em; display: block;}
.comments label{font-weight: 600;display:block;}
.comments form p.comment-notes,.comments form p.form-allowed-tags{font-size: 100%;text-align: left;}
.comments .reply{width: 40px;height: 20px;margin-left: 20px;text-align: center;line-height: 20px;border: 1px solid #CCC;background: #FFF;display: block;}
.comments .reply a{color: #444;text-decoration: none;display: block;} 
.comments .reply a:hover{color: #FFF;background: #009CDE;} 
.comments h3 small{font-size: 114%;}
#author{width: 200px; height: 2em;}
#email{width: 200px; height: 2em;}
#url{width: 200px; height: 2em;}
#comment{width: 99%; height:100px;}
a#cancel-comment-reply-link {font-size: 92%; color: #009CDE;}
#submit	{margin:0; padding:2px 25px; cursor:pointer;}


/*---------------------------------------------------------*/
/* ナビゲーションメニュー */
/*---------------------------------------------------------*/
/* ▼▼▼ヘッダーのメニュー横並び（パソコン版）▼▼▼ */
#contact{
	text-align: right;	
	background-color:#fff;
	max-width:100%;
	min-width:100%;
}
@media screen and (max-width: 760px) {
#contact{
	text-align: center;
}
}

#contact ul{
	margin: 0;
	padding: 0;
}
@media screen and (max-width: 760px) {
#contact ul{
	padding: 10px 0px;
}
}

#contact ul li{
	list-style: none;
	display: inline-block;
	width: 15%;
	min-width: 100px;
	font-size:16px;
	margin: 10px 15px;
	padding: 0;	
}
@media screen and (max-width: 760px) {
#contact ul li{
	width: 18%;
	min-width: 35px;
}
}

.contact01 a {
	color: #000;
}

.contact01:hover {
	color: #aaaaaa;
}

.contact02 a {
	color: #fff;
}
.contact02 a:hover {
	color: #fff;
}

#contact img{
    margin: 0 10px 0px 10px;
}


/*---------------------------------------------------------*/
/* ナビゲーションメニュー */
/*---------------------------------------------------------*/
/* ▼▼▼ヘッダーのメニュー横並び（パソコン版）▼▼▼ */
#header_navi{
	text-align: right;	
	background-color:#fff;
	padding:0;
	margin:0;
}
@media screen and (max-width: 760px) {
#header_navi{
	text-align: center;
}
}

#header_navi ul{
	margin: 0px;
	padding: 0px;
}
@media screen and (max-width: 760px) {
#header_navi ul{
	padding: 10px 0px;
}
}

#header_navi ul li{
	list-style: none;
	display: inline-block;
	width: 6%;
	min-width: 70px;
	font-size:16px;	
	margin: 10px 15px;
	padding: 0;	
}
@media screen and (max-width: 760px) {
#header_navi ul li{
	width: 18%;
	min-width: 35px;
}
}

#header_navi ul li a{
	text-decoration: none;
	color: #333;
}
@media screen and (max-width: 760px) {
#header_navi ul li a{
}
}

#header_navi ul li.header_navi01 a{
	color: #F33135;
}
@media screen and (max-width: 760px) {
#header_navi ul li.header_navi01 a{

}
}

#header_navi ul li a:hover{
	color: #aaaaaa;
}
@media screen and (max-width: 760px) {
#header_navi ul li a:hover{

}
}

#header_navi img{
    margin: 0 10px 0px 10px;
}
/* ▲▲▲ヘッダーのメニュー横並び（パソコン版）▲▲▲ */


/* ▼▼▼ハンバーガーメニュー▼▼▼ */
#nav-drawer {
	position: relative;
	display: flex;
	margin: 0px -5px 0px 0px;
}
@media screen and (max-width: 960px) {
#nav-drawer {

}
}

/*チェックボックス等は非表示に*/
.nav-unshown {
	display:none;
}
@media screen and (max-width: 960px) {	
.nav-unshown {

}
}

/*アイコンのスペース*/
#nav-open {
	display: inline-block;
	width: 44px;
	height: 40px;
	vertical-align: middle;
	background-color: #fff;
	margin-left: auto;
	padding: 8px 18px 0px 18px;
}
@media screen and (max-width: 960px) {	
#nav-open {
	width: 100%;
	height: 45px;
	padding: 5px 28px 0px 18px;
}
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
	position: absolute;
	right: 0.7%;
	height: 3px;/*線の太さ*/
	width: 33px;/*長さ*/
	border-radius: 3px;
	background: #555;
	display: block;
	content: '';
	cursor: pointer;
}
@media screen and (max-width: 960px) {		
#nav-open span, #nav-open span:before, #nav-open span:after {
    right: 1.9%;
}
}

#nav-open span:before {
	bottom: -12px;
}
@media screen and (max-width: 960px) {		
#nav-open span:before {

}
}

#nav-open span:after {
	bottom: -24px;
}
@media screen and (max-width: 960px) {		
#nav-open span:after {

}
}

@media only screen and (max-width : 960px){
#nav-open p {
    position: absolute;
    left: 1.9%;
    width: 100%;
    display: block;
    content: '';
    cursor: pointer;
	margin: 0;
	font-size: 20px;
	font-weight: bold;
}	
}

/*閉じる用の薄黒カバー*/
#nav-close {
	display: none;/*はじめは隠しておく*/
	position: fixed;
	z-index: 99;
	top: 0;/*全体に広がるように*/
	right: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0;
	transition: .3s ease-in-out;
}
@media screen and (max-width: 960px) {		
#nav-close {

}
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	right: 0%;
	z-index: 9999;/*最前面に*/
	width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #fff;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(205%);
	transform: translateX(205%);/*左に隠しておく*/
	padding:50px 50px 50px 50px;
}
@media screen and (max-width: 960px) {		
#nav-content {
	max-width: 230px;/*最大幅（調整してください）*/
	padding:10px 10px 10px 20px;
}
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
	display: block;/*カバーを表示*/
	opacity: .5;
}
@media screen and (max-width: 960px) {		
/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {

}
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
@media screen and (max-width: 960px) {		
#nav-input:checked ~ #nav-content {

}	
}

#nav-drawer ul li {
	text-align:left;
}

#nav-drawer ul li a{
	text-decoration: none;
	color: #333;
}

#nav-drawer ul li a:hover{
	color: #aaaaaa;
	text-decoration: underline;
}
/* ▲▲▲ハンバーガーメニュー▲▲▲ */


/* ▼▼▼ハンバーガーメニューの中のSNSボタン▼▼▼ */
.sns_button {
	position: relative; 
	overflow: hidden; 
}
.sns_button ul {
	position: relative;
	left: 50%;
	float: left;
}
.sns_button ul li {
	position: relative;
	left: -50%;
	float: left;
}
.sns_button img {
	margin: 0px 5px;
}
/* ▲▲▲ハンバーガーメニューの中のSNSボタン▲▲▲ */


/* ▼▼▼ハンバーガーメニューのナビゲーション（レスポンシブ対応）▼▼▼ */
#hamburger{
    width: 100%;	
}	
#hamburger ul{
    padding: 0;
    margin-top: 0px;
}
@media screen and (max-width: 960px) {
/* 760px以下は3列 */
#hamburger ul{
    margin-top: 20px;
}
}

#hamburger li{
	font-size: 20px;
    padding:10px 0;
    margin: 15px 0px;
    box-sizing:border-box;
    display: block;
    text-align: center;
}
@media screen and (max-width: 960px) {
#hamburger li{
	font-size: 17px;
    margin: 5px 0px;
}
}
/* ▲▲▲ハンバーガーメニューのナビゲーション（レスポンシブ対応）▲▲▲ */


/* ▼▼▼ハンバーガーメニューの固定▼▼▼ */
.fixed {
    position: fixed;
    top: 0;
    padding: 0;
    width: 100%;
    z-index: 1000;
}
/* ▲▲▲ハンバーガーメニューの固定▲▲▲ */


/* ▼▼▼パソコンとスマホでスライドショーの表示内容を切り替え（スマホ　760px）▼▼▼ */
.pc_display {
	display:block;
	margin:0;
}
.sp_display {
	display:none;
}
@media only screen and (max-width : 760px){
.pc_display {
	display:none;
}
.sp_display {
	display:block;
}
}
/* ▲▲▲パソコンとスマホでスライドショーの表示内容を切り替え（スマホ　760px）▲▲▲ */


/* ▼▼▼パソコンとスマホでスライドショーの表示内容を切り替え（スマホ　960px）▼▼▼ */
.pc_display_01 {
	display:block;
	margin:0;
}
.sp_display_01 {
	display:none;
}
@media only screen and (max-width : 960px){
.pc_display_01 {
	display:none;
}
.sp_display_01 {
	display:block;
}
}
/* ▲▲▲パソコンとスマホでスライドショーの表示内容を切り替え（スマホ　960px）▲▲▲ */


.btn_blue {
	width:100%;
	position: relative;
	display: inline-block;
	padding: 0.1em 0.5em;
	text-decoration: none;
	background: #3fa9f5;/*色*/
	border: solid 1px #0f9ada;/*線色*/
	border-radius: 4px;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
	text-align:center;
	color:#fff;
}

.btn_blue a {
	color:#fff;	
}

.btn_blue:hover {
  background-color: #fff;
	border:solid 1px #59b1eb;
	color:#000;
}

.btn_blue:active {
	border: solid 1px #03A9F4;
	box-shadow: none;
	text-shadow: none;
}

.box2 {
	float:right;
	width:200px
}

.box3 {
    padding: 0.8em 1em 2em 1em;
    margin: 2em 0;
	color: #000;/*文字色*/
    background: #FFF;
    border: solid 1px #C0C0C0;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.box3 p {
	margin: 20px 5px; 
    padding: 0;
	line-height:1.0em;
}


.double {
	position: relative;
	width: 350px;
	margin: 0 auto;
	padding: 15px;
	text-align: center;
	border-bottom: 2px solid #E73820;
	font-size:40px;
}
@media only screen and (max-width : 480px){
.double {
	width: 300px;
	font-size:30px;
}	
}

.double::before {/*疑似要素*/
	position: absolute;
	content: "";
	width: 100%;
	min-height: 100%;
	top: -10px;
	left: 0px;
	border-bottom: 1px solid #E73820;
	padding: 0;
	margin: 8px 0px 0px 0px;
}


/* ▼▼▼トップページの最新の投稿を表示（アイキャッチ画像の大きさ指定）▼▼▼ */
.ileft {
	width:300px;
height:200px;
}

@media only screen and (max-width : 760px){
.ileft {
	width:100%;
height:auto;
}
}
/* ▲▲▲トップページの最新の投稿を表示（アイキャッチ画像の大きさ指定）▲▲▲ */


/* ▼▼▼タグ一覧ページの投稿を表示（アイキャッチ画像の大きさ指定）▼▼▼ */
.itag {
	width:220px;
	height:150px;
}
/* ▲▲▲タグ一覧ページの投稿を表示（アイキャッチ画像の大きさ指定）▲▲▲ */


/* ▼▼▼トップページの最新の投稿を表示　アイキャッチ画像▼▼▼ */
/* リスト */
.new_01 {
	list-style: none;
	padding: 0px;
	margin: 15px 0px;
}
@media only screen and (max-width : 760px){
.new_01 {

}	
}

/* h5 */
.new_02 {
	font-size:1.3em;
	font-weight:bold;
	padding: 0;
	margin: 15px 0 0 0;
}
@media only screen and (max-width : 760px){
.new_02 {
	font-size:1.2em;
	margin: 10px 0 0 0;
}	
}

.new_03 {
	font-size:20px;
	font-weight:bold;
	padding: 0;
	margin: 0;
}


/* 画像 */
.new img {
	float: left;
	padding: 0;
	margin: 5px 20px 5px 10px;
}
@media only screen and (max-width : 760px){
.new img {
	margin: 5px 0px 15px 0px;
}	
}

/* ボックス */
.new {
	width:100%;
	padding: 0.5em 1em 1.0em 1em;
    color: #000;/*文字色*/
    background-color: #FFF;
    border-bottom: solid 1px #C0C0C0;/*線*/
}
@media only screen and (max-width : 760px){
.new {
	padding: 0.5em 0em;
}	
}

.new p {
	font-size:16px;
	padding: 0;
	margin: 20px 0px;
}
@media only screen and (max-width : 760px){
.new p {
	font-size:15px;
}	
}

.back_05 {
    padding: 0px 19px;
    margin: 2em 0;
    color: #2c2c2f;
    background: #fff;
}
@media only screen and (max-width : 960px){
.back_05 {
	padding: 10px 5px;
}	
}
/* ▲▲▲トップページの最新の投稿を表示　アイキャッチ画像▲▲▲ */


.front_01 {
	font-size:28px;
	font-weight:bold;
	padding: 0.3em 0.5em 0.3em 0.8em;/*文字周りの余白*/
	color: #494949;/*文字色*/
	background: #f9f9f9;/*背景色*/
	border-left: solid 6px #0066cc;/*左線（実線 太さ 色）*/
	border-bottom: solid 3px #EEEEEE;/*左線（実線 太さ 色）*/
}
@media only screen and (max-width : 960px){
.front_01 {

}	
}
@media only screen and (max-width : 480px){
.front_01 {
	font-size:18px;
}	
}


/* ▼▼▼画像横並び（スマホだと列が変わる）▼▼▼ */
*, *:before, *:after {
	box-sizing: border-box;
}

.col_2 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_2 > div {
	width: 50%;
	padding: 8px;
}
@media screen and (max-width: 960px) {
.col_2 > div {
		width: 100%;
}
}
@media screen and (max-width: 480px) {
.col_2 > div {

}
}

.col_3 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_3 > div {
	width: 33.33333%;
	padding: 10px;
}
@media screen and (max-width: 960px) {
.col_3 > div {
		width: 50%;
		padding: 5px 2px;
}
}
@media screen and (max-width: 480px) {
.col_3 > div {
		width: 100%;
		padding: 5px 7px;		
}
}

p.consultation {
	font-size:1.0em
}	
@media only screen and (max-width : 480px){
p.consultation {
	font-size:1.2em
}	
}	
	

.col_4 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_4 > div {
	width: 25%;
	padding: 5px;
	text-align: center;	
}
@media screen and (max-width: 960px) {
.col_4 > div {
	width: 50%;
}
}
@media screen and (max-width: 480px) {
.col_4 > div {

}
}
/* ▲▲▲画像横並び（スマホだと列が変わる）▲▲▲ */


.box1 {
    padding: 0em;
    margin: 0em;
    border: solid 1px #C0C0C0;
}
.box1 p {
    margin: 10px; 
    padding: 0;
	text-align:center;
}


/* ▼▼▼アーカイブにあるアイキャッチ画像▼▼▼ */
h1.archive_title {
	font-size:1.5em;
	padding: 0.3em 0.5em 0.3em 0.8em;/*文字周りの余白*/
	color: #494949;/*文字色*/
	background: #f9f9f9;/*背景色*/
	border-left: solid 6px #0066cc;/*左線（実線 太さ 色）*/
	border-bottom: solid 3px #EEEEEE;/*左線（実線 太さ 色）*/
	margin: 0.83em 0;
}
@media only screen and (max-width : 760px){
h1.archive_title {
	padding: 5px 10px;
}	
}


h2.archive_title {
	font-size: 1.2em;
	padding: 0;
	margin: 20px 0px;
}

/* リスト */
.archive_01 {
	list-style: none;
	padding: 0;
	margin: 20px 0px;
}
@media only screen and (max-width : 760px){
.archive_01 {
	list-style: none;
	padding: 0;
	margin: 20px 5px;
}	
}

/* h5 */
.archive_02 {
	font-size:16px;
	padding: 0;
	margin: 0;	
}
@media only screen and (max-width : 760px){
.archive_02 {
	
}	
}

/* 画像 */
.archive img {
	float: left;
	padding: 0;
	margin: 5px 20px 5px 10px;
}
@media only screen and (max-width : 760px){
.archive img {

}	
}

/* ボックス */
.archive {
	width:100%;
	padding: 0.5em 1em 1.5em 1em;
    font-weight: bold;
    color: #000;/*文字色*/
    background-color: #FFF;
    border-bottom: solid 1px #C0C0C0;/*線*/
}
@media only screen and (max-width : 760px){
.archive {
	padding: 0.5em 0.5em 2.0em 0.5em;
}	
}

.archive p {
	font-size:12px;
	padding: 0;
	margin: 20px 0px;
}
@media only screen and (max-width : 760px){
.archive p {

}	
}
/* ▲▲▲アーカイブにあるアイキャッチ画像▲▲▲ */


/*
==================================================
目次タグ
==================================================
*/
.rnd1{
	padding: 15px;
	margin: 15px auto;
	line-height: 30px;
}

.rbox2 {
	background-color: #FFF;
	border: 2px solid #bbb;
	border-radius: 15px;
}

.jump {
   margin-top:147px;
   padding-top:47px;
}

/*
==================================================
ジャンプ先を変更する
==================================================
*/
#a,#b,#c,#d,#e,#f,#g,#h,#i,#j,#k,#l,#m,#n  {
	margin-top:-120px;
	padding-top:120px;
}

* {

}

table {
    max-width: 100%;	
	width: 100%;
	border-spacing: 0px;
	border-collapse: collapse;
	margin:20px 0px;
	text-indent: initial;
    display: table;
}
@media only screen and (max-width : 760px){
table {
}
}

th{
	border: solid 1px #aaaaaa;	
	padding: 15px 10px;
	background: #f7f7f7;
	text-align:center;
}

@media only screen and (max-width : 760px){
table th, table td {
    padding: 10px;
    font-size: 0.8em;
}
}

td{
	border: solid 1px #aaaaaa;	
	padding: 15px 10px;
	text-align: left;
	vertical-align: top;
    box-sizing: border-box;
}

tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}
/* ▲▲▲表▲▲▲ */

.center_img {
	text-align : center;
}


/* ▼▼▼トップページのスライドショー▼▼▼ */
.Box{ height: 100%; }

.swiper-slide{ height: auto; }

.swiper-container{
    width: 100%;
	margin:55px 0 0px 0;
	position: relative;
}

.swiper-pagination-bullet {
	margin:20px 0;
}
/* ▲▲▲トップページのスライドショー▲▲▲ */


/* ▼▼▼モデルコースのスライドショー▼▼▼ */
.slider1 .swiper-slide{ height: auto; }

.slider1 .swiper-container{
    width: 100%;
	margin:0px 0;
	position: relative;
}

.slider1 .swiper-pagination-bullet {
	margin:20px 0;
}

.slider-caption {
  padding: 0px 20px;
	margin:0;
  line-height: 1.5em;
  background: #fff;
  color: #000;
  font-size: 1.0rem;
  font-weight: 700;
}

p.slider-caption {
  padding: 0px 20px;
	margin:0;	
}

@media only screen and (max-width : 760px){
.slider-caption {
  padding: 0px 20px;
	margin:0;
  line-height: 1.5em;
  background: #fff;
  color: #000;
  font-size: 0.8rem;
  font-weight: 700;
}	
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(-1 * var(--swiper-navigation-size)/ 2);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color,var(--swiper-theme-color));
}

.sw-1 {
    position: absolute;
    top: 40%;
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(-1 * var(--swiper-navigation-size)/ 2);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color,var(--swiper-theme-color));
}
/* ▲▲▲モデルコースのスライドショー▲▲▲ */


/* ▼▼▼トップページの地図（SVG画像）▼▼▼ */
      .cls-1 {
        fill: #a3d9ef;
      }

      .cls-1, .cls-10, .cls-11, .cls-13, .cls-7, .cls-8, .cls-9 {
        stroke: #fff;
        stroke-width: 0.75px;
      }

      .cls-1, .cls-10, .cls-11, .cls-13, .cls-3, .cls-4, .cls-7, .cls-8, .cls-9 {
        stroke-miterlimit: 10;
      }

.cls-10 {
	 fill:#ee9c20
}
      .cls-2 {
        fill: #fff;
      }

      .cls-3 {
        fill: #ee9c20;
      }

      .cls-3, .cls-4 {
        stroke: #ee9c20;
      }

      .cls-4 {
        fill: none;
      }

      .cls-5 {
        font-size: 21px;
      }

      .cls-5, .cls-6 {
        fill: #231815;
        font-family: TBCineRGoStd-Medium-90ms-RKSJ-H, TBCineRGothic Std;
      }

      .cls-6 {
        font-size: 14px;
      }

      .cls-7 {
        fill: #a3d9ef;
      }

      .cls-8 {
        fill: #f9cc95;
      }

      .cls-9 {
        fill: #72bae7;
      }

      .cls-10 {
        fill: #f5ed4a;
      }

      .cls-11 {
        fill: #add164;
      }

      .cls-12 {
        fill: #f6b751;
      }

      .cls-13 {
        fill: #f6b751;
      }

#aki-muroto path:hover {
fill: #d0ebf6;
}

#monobe path:hover {
fill: #f9e4ef;
}

#reihoku path:hover {
fill: #fce1c6;
}

#kochi path:hover {
fill: #98d8e8;
}

#niyodo path:hover {
fill: #f7f397;
}

#okushimanto path:hover {
fill: #d7e69d;
}

#shimanto-ashizuri path:hover {
fill: #fbe2b4;
}
/* ▲▲▲トップページの地図（SVG画像）▲▲▲ */

.event_icatch img {
	float: left;
	padding: 0;
	margin: 5px 20px 5px 10px;
}
.event_icatch {
	width:150px
}
.css-events-list table.events-table td {
    padding: 10px !important;
}


/*
==================================================
レスポンシブ対応　グリッドレイアウト
==================================================
*/

.box_1 {
padding:0 10px;
margin:10px 0;
}
.grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.item {
  border-radius: 10px;
  background: #f5f5f5;
  padding: 10px 10px 5px 10px;
}
.item img {
margin: 0 auto;
display: block;
}
.tag p {
  text-align: left;
	margin:10px;
	font-size:16px;
}


/* ▼▼▼表（観光スポットの情報詳細）レスポンシブ▼▼▼ */
.guide {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 background: #f5f5f5;
 color: #000;
	table-layout: auto;
}
.guide th {
 padding: 10px;
 background: #ffefd5;
 border: solid 2px #ffffff;
}
.guide td {
 padding: 10px;
 border: solid 2px #ffffff;
}
/* ▲▲▲表（観光スポットの情報詳細）レスポンシブ▲▲▲ */


/* ▼▼▼カテゴリーの記事一覧のページネーション▼▼▼ */
.pagination {
  clear: both;
  padding: 20px 0;
  position: relative;
  font-size: 14px;
  line-height: 1em;
        text-align: center;
}
.pagination-box {
  display: inline-block;
}
.pagination span, .pagination a {
  display: block;
  float: left;
  margin: 2px 2px 2px 0;
  padding: 10px 14px 10px 14px;
  text-decoration: none;
  width: auto;
  color: #fff; /* 通常の文字色 */
  background: #0066cc; /* 通常の背景色 */
  border-radius: 50%; /* 角を丸くして円形に */
}
.pagination span.page-of {
  background: none;
  color: #000;
}
.pagination a:hover{
  color: #000; /* マウスホバー時の文字色 */
  background: #EEEEEE; /* マウスホバー時の背景色 */
}
.pagination .current{
  padding: 10px 14px 10px 14px;
  color: #000; /* 現在のページの文字色 */
  background: #EEEEEE; /* 現在のページの背景色 */
}
@media only screen and (max-width: 413px) {
.pagination {
  font-size: 12px;
  line-height: 12px;
}
.pagination span, .pagination a {
  padding: 7px 10px 7px 10px;
}
.pagination .current{
  padding: 7px 10px 7px 10px;
}
}
/* ▲▲▲カテゴリーの記事一覧のページネーション▲▲▲ */


/*
==================================================
YouTubeの大きさを100％にする（レスポンシブ）
==================================================
*/
.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 760px) {
.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}
}

/* ▼▼▼ページのトップに戻る（右下のボタン）▼▼▼ */
#pagetop {
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #0066cc;
  opacity: 0.8;
  border-radius: 50%;
  z-index:999;
}
#pagetop a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#pagetop a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #603813;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#pagetop a::after{
  content: 'PAGE TOP';
  font-size: 13px;
  color: #603813;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
/* ▲▲▲ページのトップに戻る（右下のボタン）▲▲▲ */



/*==================================================
スライダーのためのcss
===================================*/
.slider img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
    margin:0 10px;/*スライド左右の余白調整*/
}

.slider-caption {
  padding: 0px 20px;
	margin:0;
  line-height: 1.5em;
  background: #fff;
  color: #000;
  font-size: 1.0rem;
  font-weight: 700;
}

p.slider-caption {
  padding: 0px 20px;
	margin:0;	
}

@media only screen and (max-width : 760px){
.slider-caption {
  padding: 0px 20px;
	margin:0;
  line-height: 1.5em;
  background: #fff;
  color: #000;
  font-size: 0.8rem;
  font-weight: 700;
}	
}

/* ▼▼▼SNSシェアボタン▼▼▼ */
.fa-hatena:before {
  font-family: Verdana;
  font-weight: bold;
  content: 'B!';
}
 
.share {
  margin-top: 20px;
  margin-bottom: 40px;
}
 
.share ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
 
.share ul:after {
  display: block;
  clear: both;
  content: '';
}
 
.share li {
  float: left;
  width: 25%;
  margin: 0;
  margin-top: 15px;
}
 
.share li i {
    font-size: 1.3em;
    padding-top: 3px;
  }
  .share li span {
    display: none;
  }
.share li a {
  font-size: 14px;
  display: block;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  color: #fff;
}
 
.share li a:hover {
  opacity: .8;
}
 
.share li a:visited {
  color: #fff;
}
 
.tweet a {
  background-color: #55acee;
}
 
.facebook a {
  background-color: #315096;
}
 
.pocket a {
  background-color: #dd4b39;
}
 
.hatena a {
  background-color: #008fde;
}
 
@media(max-width: 599px) {
  .share li {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 3px;
  }
  .share li i {
    font-size: 1.3em;
    padding-top: 3px;
  }
  .share li span {
    display: none;
  }
}
/* ▲▲▲SNSシェアボタン▲▲▲ */


/* ▼▼▼パン屑リスト▼▼▼ */
#breadcrumb {
	margin: 10px 0 0 10px;
}
@media only screen and (max-width : 760px){
#breadcrumb {
	margin: 10px 0 0 10px;
}
}
/* ▲▲▲パン屑リスト▲▲▲ */

@media only screen and (max-width : 760px){
label {
	width:100%:
}
}

/* ▼▼▼カテゴリーの色付け▼▼▼ */
.eat{
  background:#eb7b00;
	padding:2px;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.play{
  background:#ed3131;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.health{
  background:#1E90FF;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.history{
  background:#8A2BE2;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.connect{
  background:#FF9900;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.work{
  background:#3366CC;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.kochi{
  background:#72bae7;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.niyodo{
  background:#ffd700;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.okushimanto{
  background:#add164;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.shimanto{
  background:#f6b751;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.reihoku{
  background:#e9967a;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.monobe{
  background:#a3d9ef;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.aki{
  background:#a3d9ef;
	padding:0px 2px 1px 2px;
	margin:0 2px;
}

.new_04 {
	text-align:right;
	margin:10px 2px 0 2px;
}

.new_04 a {
	font-size:14px;
	color: #fff;
	text-decoration:none;
	text-align:right;
}

.new_05 {
	text-align:left;
	margin:5px 0 0 0;
}

@media only screen and (max-width : 760px){
.new_05 {
	text-align:left;
	margin:15px 0 0 0;
}
}

.new_05 {
	text-align:left;
}

.new_05 a {
	font-size:14px;
	color: #fff;
	text-decoration:none;
	text-align:right;
}
/* ▲▲▲カテゴリーの色付け▲▲▲ */


/*
==================================================
口コミ体験談　左
==================================================
*/
.balloon1 {
    width: 100%;
    margin: 1.5em 0;
    overflow: hidden;
}

.balloon1 .faceicon1 {
    float: left;
    margin-right: -90px;
    width: 80px;
}

.balloon1 .faceicon1 img{
    width: 100%;
    height: auto;
    border: solid 3px #FFF0F5;
    border-radius: 50%;
}

.balloon1 .chatting1 {
    width: 100%;
}

.says1 {
    display: inline-block;
    position: relative; 
    margin: 5px 0 0 105px;
    padding: 17px 13px;
    border-radius: 12px;
    background: #FFF0F5;
}

.says1:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 18px; 
    left: -24px;
    border: 12px solid transparent;
    border-right: 12px solid #FFF0F5;
}

.says1 p {
    margin: 0;
    padding: 0;
    font-size: 15px;	
}

/*
==================================================
口コミ体験談　右
==================================================
*/

.balloon2 {
    width: 100%;
    margin: 1.5em 0;
    overflow: hidden;
}

.balloon2 .faceicon2 {
    float: right;
    margin-left: -90px;
    width: 80px;
}

.balloon2 .faceicon2 img{
    width: 92%;
    height: auto;
    border: solid 3px #D7EEFF;
    border-radius: 50%;
}

.balloon2 .chatting2 {
    width: 100%;
}

.says2 {
    display: inline-block;
    position: relative; 
    margin: 5px 105px 0 0px;
    padding: 17px 13px;
    border-radius: 12px;
    background: #D7EEFF;	
}

.says2:after {
	content: "";
	position: absolute;
	top: 18px;
	right: -24px;
	border: 12px solid transparent;
	border-left: 14px solid #D7EEFF;
}

.says2 p {
    margin: 0;
    padding: 0;
    font-size: 15px;	
}


/*
==================================================
吹き出し　灰色枠　右
==================================================
*/

.balloon61 {
    width: 100%;
    margin: 1.5em 0;
    overflow: hidden;
}

.balloon61 .faceicon61 {
    float: right;
    margin-left: -90px;
    width: 80px;
}

.says61 {
    position: relative; 
    margin: 0px 105px 0px 0px;
    padding: 3px 15px 3px 15px;
    border-radius: 6px 6px 6px 6px;
    border: solid 1px #999999;
    background-color: #fff;
}

.says61 p {
    margin: 7px 0px 7px 5px; 
	padding: 3px 3px 3px 3px;
    font-size: 1.05em;
    line-height: 1.8em;
}

.says61:before {
	content: "";
	position: absolute;
	top: 30px;
	right: -23px;
 	margin-top: -8px;
	border: 12px solid transparent;
	border-left: 12px solid #fff;
 	z-index: 2;
}

.says61:after {
    content: "";
    position: absolute;
    top: 33px;
    right: -24px;
    margin-top: -11px;
    border: 12px solid transparent;
    border-left: 12px solid #999999;
    z-index: 1;
}

/*
==================================================
吹き出し　灰色枠　左
==================================================
*/

.balloon62 {
    width: 100%;
    margin: 1.5em 0;
    overflow: hidden;
}

.balloon62 .faceicon62 {
    float: left;
    margin-right: -90px;
    width: 80px;
}

.balloon62 .chatting62 {
    width: 100%;
}

.says62 {
    position: relative; 
    margin: 0px 0px 0px 105px;
    padding: 10px 10px;
    border-radius: 6px 6px 6px 6px;
    border: solid 1px #999999;
}

.says62:before {
	content: "";
	position: absolute;
	top: 40px;
	left: -24px;
 	margin-top: -12px;
	border: 12px solid transparent;
	border-right: 12px solid #fff;
 	z-index: 2;
}

.says62:after {
	content: "";
	position: absolute;
	top: 40px;
	left: -28px;
 	margin-top: -14px;
	border: 14px solid transparent;
	border-right: 14px solid #999;
 	z-index: 1;
}

.says62 p {
    margin: 7px 0px 7px 5px; 
	padding: 3px 0px 3px 0px;
    font-size: 1.0em;
    line-height: 1.8em;	
}


/*
==================================================
ボックス８
==================================================
*/
.box8 {
    position: relative;
    margin: 25px 0px 25px 0px;
    padding: 25px 10px 7px;
    border: solid 2px #FFA500;
}
.box8 .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: -2px;
    padding: 9px 9px 9px 9px;
    height: 40px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 19px;
    background: #FFA500;
    color: #ffffff;
    font-weight: bold;
}
.box8 p {
    padding: 15px 20px;
    margin: 0;
}

/*
==================================================
ボックス15
==================================================
*/
.box15 {
    padding: 0.5em 0.5em 0.5em 0.7em;
    margin: 1em 0;
    color: #2c2c2f;
    background: #F5F5F5;/*背景色*/
    border-left: solid 7px #FFD700;/*左線*/
    border-right: solid 7px #FFD700;/*右線*/	
}
.box15 p {
    margin: 20px 0px 20px 0px;
    padding: 0px 5px 0px;
}

/*
==================================================
ボックス２２　女性の手順で使う
==================================================
*/
.box22 {
    position: relative;
    padding: 0.5em 0.7em;
    margin: 1em 0;
    background: #FFF5EE;
    color: #5c98d4;
    font-weight: bold;
  font-size: 19px;	
  color: #555;
}

.box22:after{
    position: absolute;
    content: '';
    top: 100%;
    left: 50%;
    border: 15px solid transparent;
    border-top: 15px solid #FFF5EE;
    width: 0;
    height: 0;
}

.box22 p {
	margin: 0;
	padding: 0;
    font-weight: bold;
    text-align: center;	
}

/*
==================================================
ボックス２３　女性の手順で使う最後
==================================================
*/
.box23 {
  position: relative;
  display: inline-block;
  margin: 0em 0 1.5em 0;
  padding: 7px 10px;
  min-width: 100%;
  max-width: 100%;
  color: #555;
  font-size: 19px;
  box-sizing: border-box;
  border-radius: 5px;
  background: #FFF5EE;	
}

.box23 p {
	margin: 0;
	padding: 0;
    font-weight: bold;	
    text-align: center;	
}

/*
==================================================
ボックス２４　モデルコースで使う
==================================================
*/
.box24 {
  position: relative;
  padding: 1.0rem 2rem;
  border-bottom: 3px solid #d8d8d8;
  background: #fff;
  margin:50px 0;
  text-align:center;
  font-size:20px;
  font-weight:bold;
}

.box24:before {
  position: absolute;
  bottom: -14px;
  left: 50%;
  width: 0;
  height: 0;
  content: '';
  border-width: 14px 12px 0 12px;
  border-style: solid;
  border-color: #d8d8d8 transparent transparent transparent;
}

.box24:after {
  position: absolute;
  bottom: -10px;
  left: 50%;
  width: 0;
  height: 0;
  content: '';
  border-width: 14px 12px 0 12px;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
}


/*
==================================================
おすすめの記事タグ
==================================================
*/
.r {
    overflow: hidden;
	padding: 10px 10px 10px 10px;
    margin: 2em 0;
    color: #2c2c2f;
    background: #f5f5f5;
    border-top: solid 5px #FFA07A;
    border-bottom: solid 5px #FFA07A;
}
.r_image {
    float: left;
    margin: 0px 10px 0px 0px;
}

.r_text {
    font-size: 14px;
    overflow: hidden;
    margin: 0; 
    padding: 0;
	line-height: 1.7em;
}

.r_head {
    font-size: 16px;
    font-weight: bold;
	border-bottom:none;
	margin: 0px 0px 0px 0px;
    line-height: 1.5em;
	margin: -10px 0px -10px 0px;
}

@media screen and (max-width: 760px) {
.r {
    overflow: hidden;
	padding: 0px 10px 10px 10px;
    margin: 2em 0;
    color: #2c2c2f;
    background: #f5f5f5;
    border-top: solid 4px #FFA07A;
    border-bottom: solid 4px #FFA07A;
}
.r_image {
    margin: 40px 10px 0px 0px;
	float: left;
	width:	130px;
}
.r_text {
    font-size: 12px;
	line-height: 1.5em;
}
.r_head {
    font-size: 14px;
    font-weight: bold;
	line-height: 1.5em;
	margin: -10px 0px -10px 0px;
}
}

.red {
    color: #FF0000;
    font-size: 120%;
}
.red-01 {
    color: #FF0000;
}

/* ▼▼▼下線マーカー▼▼▼ */
.yellow_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #e6f2ff 0%) repeat scroll 0 0;}

.pink_line{	background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffc0cb 0%) repeat scroll 0 0;}

.blue_line{	background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #c1e0ff 0%) repeat scroll 0 0;}

.green_line{	background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #b2ffb2 0%) repeat scroll 0 0;}

.orange_line{	background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffe0c1 0%) repeat scroll 0 0;}
/* ▲▲▲下線マーカー▲▲▲ */


.ez-toc-page-1, .ez-toc-heading-level-3 {
	margin:8px 0px 8px 0px !important;
}

div#ez-toc-container ul li {
	margin:8px 0px 8px 0px !important;
}


/*
==================================================
ボックス26
==================================================
*/
.box26 {
    padding: 15px 19px;
    margin: 2em 0;
    color: #2c2c2f;
    background: #f5f5f5;
}
.box26 p {
	font-size:14px;
    margin: 0; 
    padding: 0;
}

.gallery{
	margin:0 0 5px 0;
}

.gallery li{
list-style:none;
}

/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
	z-index: 3;
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #ccc;/*矢印の色*/
    border-right: 2px solid #ccc;/*矢印の色*/
    height: 25px;
    width: 25px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left:2.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right:2.5%;
    transform: rotate(45deg);
}

/*選択するサムネイル画像の設定*/

.choice-btn li{
	cursor: pointer;
	outline: none;
	background:#333;
	width:33.3333%!important;
list-style:none;
}

.choice-btn li img{
	opacity: 0.4;/*選択されていないものは透過40%*/
}

.choice-btn li.slick-current img{
	opacity: 1;/*選択されているものは透過しない*/
}


/*
==================================================
お問い合わせ
==================================================
*/
.contact-width{max-width: 100%;}

/*必須の調整*/
.haveto{
 font-size:7px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
.any{
 font-size:7px;
 padding:5px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}

/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
 padding:1em 0;
 margin-top:30px;
 width:100%;
 background:#ffaa56;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:30px;
 border: none;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#ffaa56;
 color:#fff;
}

.inquiry th{
text-align:left;
vertical-align: top;
}

input {

}
@media screen and (max-width: 960px) {
input {
width: 100%;
}
}

textarea {
width: 100%;
}

.wpcf7-form-control{
font-size:17px;
}

input[type="checkbox" i] {
margin: 3px 3px 3px 4px;
}


.contact_kakomi {
    width: 900px;
    margin: 0 auto;	
}
.contact_kakomi p {
	font-size:24px;
	text-align:center;
}
@media screen and (max-width: 960px) {
.contact_kakomi {
    width: 100%;
	text-align:left;
}
}
@media screen and (max-width: 960px) {
.contact_kakomi p {
	text-align:left;
}
}

/* ▼▼▼reCAPTCHAボタンを表示させない▼▼▼ */
.grecaptcha-badge { visibility: hidden; }
/* ▲▲▲reCAPTCHAボタンを表示させない▲▲▲ */


/*
==================================================
リンクボタン　黄色
==================================================
*/
.btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 380px;
	height: 60px;
	color: #333;
	font-size: 18px;
	font-weight: 600;
	text-decoration: none;
}
@media screen and (max-width: 760px) {
.btn a {
	width: 100%;
}
}

.btn a:hover {
	color: #808080;
}

.btn01 a {
	background-color: #fff100;
	border: 1px solid transparent;
	border-radius: 35px;
}

.btn01 a::before {
	content: '';
	position: absolute;
	top: -5px;
	left: -5px;
	width: 100%;
	height: 100%;
	background-color: transparent;
	border: 1px solid #888888;
	border-radius: 35px;
}

.btn01 a:hover {
	background-color: #FFFF66;
}


/*-------------------------
  ブログカード
-------------------------*/
.tmt-blog-card {
	margin:50px 0;
}
a.tmt-blog-card {
	color:#000;
  border: 1px solid #e1e1e1;
  box-shadow: 2px 2px #ddd;
  display: block;
  padding: 20px;
  position: relative;
  width: 100%;
text-decoration: none;
}
a.tmt-blog-card::before {
    background-color: #FFCC33;
    border: solid 1px #939393;
    color: #FFFFFF;
    content: '合わせて読みたい';
    font-size: 14px;
		font-weight: bold;
    display: block;
    padding: 4px 20px;
    position: absolute;
    top: -15px;
    left: 25px;
  }
a.tmt-blog-card::after {
    border: solid 1px #939393;
    color: #000;
    content: '続きを読む';
    font-size: 14px;
    display: block;
    padding: 5px 20px;
    position: absolute;
    bottom: 10px;
    right: 20px;
  }
a.tmt-blog-card:hover {
    box-shadow: none;
    opacity: .8;
text-decoration: underline;
  }
.tmt-blog-card-box {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.tmt-blog-card-title {
    font-size: 18px;
    font-weight: 600;
    color: #428bca;
    padding-bottom: 5px;
  }

.tmt-blog-card-thumbnail {
    flex: 1;
    margin-right: 15px;
    padding-top: 5px;
  }
.tmt-blog-card-thumbnail img {
      width: 80%;
    }
.tmt-blog-card-content {
    flex: 2.5;
  }

.tmt-blog-card-excerpt {
    color: #000;
    font-size: 14px;
    padding-bottom: 15px;
  }
.tmt-blog-card-site {
    color: #b2b2b2;
    font-size: 11px;
    padding-left: 5px;
  }
.tmt-blog-card-site img {
      margin-right: 5px;
      vertical-align: bottom;
      width: 20px;
    }
@media (max-width: 980px) {
  .tmt-blog-card-excerpt {
    border: none;
  }
.tmt-blog-card-thumbnail img {
      width: 100%;
    }
}
@media (max-width: 640px) {
  a.tmt-blog-card {
    padding: 10px 10px 20px 10px;
  }
  a.tmt-blog-card::before {
    font-size: 11px;
    padding: 2.5px 8px;
    top: -15px;
    left: 10px;
  }
  a.tmt-blog-card::after {
    font-size: 12px;
    padding: 2px 13px;
    right: 10px;
  }
  .tmt-blog-card-thumbnail {
    margin-right: 10px;
    padding-top: 10px;
  }
  .tmt-blog-card-title {
    font-size: 14px;
  }
  .tmt-blog-card-excerpt {

  }
.tmt-blog-card-content {
	flex: 1;
  }
}


/*スクロールバーの横幅指定*/
.scrollArea{
	height: 300px;
	overflow: auto;
	padding-right: 20px;
	    border: 1px #ffbf7f solid;
	
	margin:25px 5px 20px 5px;
padding:5px 8px 5px 8px;
}
/*スクロールバーの横幅指定*/
.scrollArea.deco::-webkit-scrollbar {
    width: 15px;
}
/*スクロールバーの背景色・角丸指定*/
.scrollArea.deco::-webkit-scrollbar-track {
  border-radius: 10px;
	background: #f2f2f2;
}
/*スクロールバーの色・角丸指定*/
.scrollArea.deco::-webkit-scrollbar-thumb {
  border-radius: 10px;
	background:#09C9D9;
}


/* ▼▼▼次の記事・前の記事▼▼▼ */
.post-navigation {
    display: flex;
    gap: 20px;
    margin: 50px 0 40px 0;
}

.nav-prev, .nav-next {
    flex: 1;
}

.nav-prev a, .nav-next a {
    display: flex;
    align-items: center;
    padding: 20px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    text-decoration: none;
    color: #333;
}

.nav-prev a:hover, .nav-next a:hover {
    border-color: #0066cc;
}

.nav-thumbnail {
    width: 80px;
    height: 80px;
    border-radius: 4px;
    overflow: hidden;
}

.nav-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nav-text {
    flex: 1;
}

.nav-prev .nav-text {
    margin-left: 15px;
}

.nav-next .nav-text {
    margin-right: 15px;
    text-align: right;
}

.nav-label {
    font-size: 12px;
    color: #666;
    display: block;
    margin-bottom: 5px;
}

.nav-title {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
}

@media (max-width: 768px) {
    .post-navigation {
        flex-direction: column;
        gap: 15px;
    }
}
/* ▲▲▲次の記事・前の記事▲▲▲ */


/*
==================================================
ボックス10
==================================================
*/
.box10 {
    margin: 2em 0;
    background: #FFFFFF;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.box10 .box-title {
    font-size: 1.3em;
    background: #FF0000;
    padding: 4px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.box10 p {
	font-size: 1.0em;
    padding: 20px 20px 20px 20px;
    margin: 0;
	font-weight: normal;
}

/*
==================================================
引用タグ　カスタマイズ
==================================================
*/
blockquote {
    position: relative;
    padding: 10px 20px;
    box-sizing: border-box;
    font-style: italic;
    color: #4e4e4e;
    background: #f3f3f3;
}

blockquote:before{
    display: inline-block;
    position: absolute;
    top: 7px;
    left: 10px;
content:"\f10d";
 font-family: "Font Awesome 5 Free";
    color: #c4c4c4;
    font-size: 58px;
    line-height: 1;
    font-weight: 900;
}

blockquote:after{
    display: inline-block;
    position: absolute;
    bottom: 5px;
    right: 15px;
    text-align: center;
content:"\f10d";
 font-family: "Font Awesome 5 Free";
    color: #c4c4c4;
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
}

blockquote p {
    position: relative;
    padding: 0;
    margin: 10px 0;
    z-index: 3;
    line-height: 1.7;
}

blockquote cite {
    position: relative;
    z-index: 3;
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}

.mask-bg {
  color: transparent;
  display: inline-block;
  font-size: 36px;
  font-weight: bold;
  overflow: hidden;
  position: relative;
  transition: color 0ms 450ms;
}
.mask-bg::after {
  background: linear-gradient(to right, #362ae0 0%,#3b79cc 50%,#42d3ed 100%);
  bottom: 0;
  content: '';
  display: block;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(0, 100%);
}
 
.mask-bg.is-animated {
  color: #362ae0;
}
.mask-bg.is-animated::after {
  animation: mask-bg 1.2s cubic-bezier(0.8, 0, 0.170, 1);
}
 
@keyframes mask-bg {
  0% {
    transform: translate(0, 101%)
  }
  40%, 60% {
    transform: translate(0, 0%)
  }
  100% {
    transform: translate(0, -100%)
  }
}


/*
==================================================
ボタンを押すと開く
==================================================
*/
.grad-btn {
  display:block;  
  max-width: 280px;
  border: 2px solid #FF9900;
  background-color: #FF9900;
  font-size: 16px;
  color: #FFF;
  font-weight: bold;
  padding:16px;
  text-align: center;
  border-radius: 4px;
  transition: .4s;
}
.grad-btn:hover {
  border: 2px solid #FF9900;
  background-color: #FFF;
  color: #333
}
.grad-item {
  position: relative;
  overflow: hidden;
  height: 80px; /*隠した状態の高さ*/
}
.grad-item::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px; /*グラデーションで隠す高さ*/
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  content: "";
}
.grad-trigger {
  display: none; /*チェックボックスは常に非表示*/
}
.grad-trigger:checked + .grad-btn {
  display: none; /*チェックされていたら、grad-btnを非表示にする*/
}
.grad-trigger:checked ~ .grad-item {
  height: auto; /*チェックされていたら、高さを戻す*/
}
.grad-trigger:checked ~ .grad-item::before {
  display: none; /*チェックされていたら、grad-itemのbeforeを非表示にする*/
}


/*
==================================================
会員表
==================================================
*/
 
.table-responsive .wrap_scroll_table {
  width: 400px;
  overflow-x: scroll;
  margin: 0 auto;
}

.table-responsive .scroll_table {
  margin-top: 10px;
  max-width: 400px;
  margin: 0 auto;
}

.table-responsive .scroll_table,
.table-responsive .scroll_table td,
.table-responsive .scroll_table th {
  border: 1px solid #cbced2;
  border-collapse: collapse;
  text-align: center;
}

.table-responsive .scroll_table th {
  background: #01214d;
  color: #fff;
  padding: 4px 12px;
}

.table-responsive .scroll_table td {
  background: #f5f6f8;
  padding: 4px 12px;
}

.table-responsive .txt {
  width: 400px;
  margin: 0 auto;
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 2px;
}


/*---------------------------------------------------------*/
/* ヘッダーナビゲーション（レスポンシブ） - 新デザイン */
/*---------------------------------------------------------*/

.header{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 77px;
  z-index: 999;
  background-color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

@media only screen and (max-width: 1370px) {
  .header{
    height: 80px;
  }
}

@media only screen and (max-width: 760px) {
  .header{
    height: 60px;
  }
}

.header_inner {
  position: relative;
  padding: 0px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
}

.logo{
  display: flex;
  align-items: center;
}

@media only screen and (max-width: 1371px) {
  .logo{
    padding: 3px 10px;
  }
}

.title{
  font-size: 1.2rem;
  font-weight: 600;
  margin: 0;
  display: flex;
  align-items: center;
}

.logo-image {
  width: 320px;
  height: auto;
  margin-right: 10px;
}
@media screen and (max-width: 760px) {
.logo-image {
  width: 260px;
  height: auto;
  margin-right: 10px;
}
}
@media screen and (max-width: 480px) {
.logo-image {
  width: 240px;
  height: auto;
  margin-right: 10px;
}
}

.logo-text {
  font-size: 1.2rem;
  color: #333;
}

.support-btn a {
  background-color: #0099cc;
  color: white !important;
  padding: 12px 20px !important;
  border-radius: 30px;
  transition: background-color 0.3s;
}

.support-btn a:hover {
  background-color: #007a4d;
}

/* ナビゲーションアイコンのスタイル（共通） */
.nav_icon {
  display: inline-block;
  width: 40px;
  height: 40px;
  margin-right: 10px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  flex-shrink: 0; /* アイコンが縮まないように */
}

/* 各メニュー項目のアイコン */
.nav_icon_about {
  background-image: url('data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230066cc'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z'/%3E%3C/svg%3E');
}

.nav_icon_activity {
  background-image: url('');
}

.nav_icon_support {
  background-image: url('');
}

.nav_icon_visit {
  background-image: url('');
}

.nav_icon_contact {
  background-image: url('https://kochi-ai.com/wp-content/uploads/icon-05.jpg');
}

@media only screen and (max-width: 1371px) {
  .nav {
    position: fixed;
    right: -320px; /* 右から出てくる */
    top: 0;
    width: 300px; /* スマホに収まるサイズ */
    height: 100vh;
    padding-top: 60px;
    background-color: #fff;
    transition: all .6s;
    z-index: 200;
    overflow-y: auto; /* メニューが多くなったらスクロールできるように */
  }
  
  .hamburger {
    position: absolute;
    right: 15px;
    top: 10px;
    width: 40px; /* クリックしやすい幅 */
    height: 40px; /* クリックしやすい高さ */
    cursor: pointer;
    z-index: 300;
  }
  
  .nav_list {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .nav_item {
    text-align: center;
    padding: 0px 14px 0px 14px;
  }
  
  .nav_item a {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* 左寄せにする */
    padding: 28px 10px 18px 10px;
    border-bottom: 1px solid #eee;
    text-decoration: none;
    color: #333;
  }
  
  .nav_item a:hover {
    background-color: #eee;
  }
  
  .hamburger_border {
    position: absolute;
    left: 11px;
    width: 30px;
    height: 3px;
    background-color: #333;
    transition: all .6s;
  }
  
  .hamburger_border_top {
    top: 14px;
  }
  
  .hamburger_border_center {
    top: 24px;
  }
  
  .hamburger_border_bottom {
    top: 34px;
  }
  
  .black_bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 100;
    background-color: #333;
    opacity: 0;
    visibility: hidden;
    transition: all .6s;
    cursor: pointer;
  }

  /* 表示された時用のCSS */
  .nav-open .nav {
    right: 0;
  }
  
  .nav-open .black_bg {
    opacity: .8;
    visibility: visible;
  }
  
  .nav-open .hamburger_border_top {
    transform: rotate(45deg);
    top: 20px;
  }
  
  .nav-open .hamburger_border_center {
    width: 0;
    left: 50%;
  }
  
  .nav-open .hamburger_border_bottom {
    transform: rotate(-45deg);
    top: 20px;
  }
  
  .support-btn a {
    margin: 20px auto;
    width: 80%;
  }
}/* sp */

@media only screen and (min-width: 1370px) {
  .header_inner{
    width: 100%;
    padding: 10px 10px 10px 30px;
    margin-left: auto;
    margin-right: auto;
  }
  
  .logo{
    padding: 3px 0;
  }
  
  .nav_list{
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .nav_item{
    margin: 0 25px;
  }
  
  .nav_item a{
    color: #333;
    font-weight: 500;
    text-decoration: none;
    position: relative;
    padding: 10px 0;
    display: flex;
    align-items: center;
  }
  
  .nav_item a::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 0;
    height: 2px;
    background-color: #0066cc;
    transition: .2s;
  }
  
  .nav_item a:hover::after {
    width: 100%;
  }
  
  .support-btn {
    margin-left: 15px;
  }
  
  .support-btn a::after {
    display: none;
  }
}/* pc */

/* ハンバーガーメニュー固定用 */
.hamburger.fixed {
  position: fixed;
  top: 10px;
}


/*
==================================================
ヘッダーメニューのSNSアイコン
==================================================
*/
/* SNSアイコン用のCSS */
.social-icons {
  display: flex;
  align-items: center;
}

.social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin: 0;
  border-radius: 50%;
  color: #ffffff !important;
  transition: all 0.3s ease;
  text-decoration: none;
  line-height: 1;
}

.social-icon:hover {
  transform: translateY(-2px);
}

.social-icon.facebook {
  background-color: #3b5998;
}

.social-icon.instagram {
  background: linear-gradient(45deg, #0066cc 0%, #0099cc 25%, #00aadd 50%, #0088cc 75%, #0066aa 100%);
}

.social-icon.x-twitter {
  background-color: #000000;
}

.social-icon i {
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

/* レスポンシブ対応 */
@media only screen and (max-width: 1370px) {
  .social-icons {
    justify-content: center;
    margin-top: 20px;
    padding-bottom: 20px;
  }
  
  .social-icon {
    width: 42px;
    height: 42px;
    margin: 0;
  }
  
  .social-icon i {
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  
  .nav_item.social-icons {
    border-bottom: 1px solid #eee;
  }
  
  .nav_item.social-icons a {
    display: inline-flex;
    border-bottom: none;
    padding: 0;
  }
}

/* PC表示での調整 */
/* アイコンのレイアウト修正追加 */
.social-icon.facebook i {
  position: relative;
  left: 1px; /* Facebookのアイコンを少し右に調整 */
}

.social-icon.instagram i {
  position: relative;
  top: 0px; /* Instagramのアイコンの縦位置調整 */
}

.social-icon.x-twitter i {
  position: relative;
  top: 0px; /* Xのアイコンの縦位置調整 */
}

@media only screen and (min-width: 1371px) {
  .social-icons {
    margin-left: 0px;
  }
  
  .social-icon {
    width: 32px;
    height: 32px;
  }
  
  .social-icon i {
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  
  .nav_item.social-icons a::after {
    display: none;
  }
}





/*
==================================================
お知らせ情報・活動報告セクション
==================================================
*/  

/* 基本レイアウト */
.hachi-background {
    padding: 50px 20px 50px 20px;
    margin: 0 auto;
    width: 100%;
}

.hachi-event-box,
.hachi-activity-box {
    background-color: #fff;
    border-radius: 20px;
    padding: 40px;
    margin: 20px auto;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    max-width: 1100px;
}

.hachi-event-heading,
.hachi-activity-heading {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 30px;
}

/* リスト共通スタイル */
.hachi-event-list,
.hachi-activity-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.hachi-event-item,
.hachi-activity-item {
    padding-bottom: 30px;
    border-bottom: 1px solid #eee;
}

.hachi-event-item:last-child,
.hachi-activity-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

/* コンテンツラッパー */
.hachi-event-content-wrapper,
.hachi-activity-content-wrapper {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

/* 画像スタイル */
.hachi-event-image,
.hachi-activity-image {
    flex: 0 0 150px;
    max-width: 150px;
    overflow: hidden;
}

.hachi-event-image img,
.hachi-activity-image img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    transition: transform 0.3s ease;
}

.hachi-event-image img:hover,
.hachi-activity-image img:hover {
    transform: scale(1.1);
}

/* コンテンツエリア */
.hachi-event-content,
.hachi-activity-content {
    flex: 1;
}

.hachi-event-date,
.hachi-activity-date {
    font-size: 14px;
    color: #999;
    margin-bottom: 5px;
}

.hachi-event-title,
.hachi-activity-title {
    font-size: 18px;
    margin: 0 0 10px 0;
}

.hachi-event-description,
.hachi-activity-description {
    font-size: 16px;
    color: #444;
    margin-bottom: 15px;
}

/* ボタンスタイル */
.hachi-event-button,
.hachi-activity-button {
    display: inline-block;
    background: #0066cc;
    color: #333;
    padding: 8px 20px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(255, 215, 0, 0.3);
    border: 1px solid #FFD700;
}

.hachi-event-button:hover,
.hachi-activity-button:hover {
    background: #0066cc;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(255, 165, 0, 0.4);
    color: #fff;
}

.hachi-event-more-container,
.hachi-activity-more-container {
    text-align: right;
    width: 100%;
    margin-top: 15px;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) and (min-width: 481px) {
    /* 768px以下でも横並びを維持 */
    .hachi-event-content-wrapper,
    .hachi-activity-content-wrapper {
        display: flex;
        flex-direction: row;
        gap: 15px;
    }
    
    .hachi-event-image,
    .hachi-activity-image {
        flex: 0 0 120px;
        max-width: 120px;
    }
    
    .hachi-event-box,
    .hachi-activity-box {
        padding: 25px;
		margin: 20px auto;
    }
	.hachi-background {
        padding: 30px 20px 50px 20px;
}
}

@media screen and (max-width: 480px) {
    /* 480px以下で縦並びに */
    .hachi-event-item .hachi-event-content-wrapper,
    .hachi-activity-item .hachi-activity-content-wrapper {
        flex-direction: column;
        gap: 15px;
    }
    
    .hachi-event-item .hachi-event-image,
    .hachi-activity-item .hachi-activity-image {
        flex: none;
        max-width: none;
        width: 100%;
        margin-bottom: 15px;
    }
    
    .hachi-event-item .hachi-event-image img,
    .hachi-activity-item .hachi-activity-image img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        border-radius: 8px;
        display: block;
    }
    
    .hachi-event-content,
    .hachi-activity-content {
        width: 100%;
        margin: 0;
    }
    
    .hachi-event-button,
    .hachi-activity-button {
        padding: 6px 16px;
        font-size: 13px;
    }
    
    .hachi-event-more-container,
    .hachi-activity-more-container {
        text-align: center;
        margin-top: 10px;
    }
    
    .hachi-event-box,
    .hachi-activity-box {
        padding: 25px;
    }
	.hachi-background {
        padding: 30px 20px 50px 20px;
}	
}


/*
==================================================
固定ページの幅調整
==================================================
*/
.page-container {
    width: 900px;
    margin: 0 auto;
	font-size:20px;
}
@media screen and (max-width: 960px) {
.page-container {
    width: 100%;
margin: 0;
	padding:0;
}
}
@media screen and (max-width: 760px) {
.page-container {
	margin-top: 30px;
}
}


/*
==================================================
投稿ページのSNSシェアボタン
==================================================
*/
        .participation-info {
            text-align: center;
            margin: 40px 0;
            font-size: 18px;
            position: relative;
        }
        
        .participation-info::before,
        .participation-info::after {
            content: "";
            position: absolute;
            width: 25px;
            height: 1px;
            background-color: #333;
            top: 50%;
            transform: translateY(-50%);
        }
        
        .participation-info::before {
            left: 20%;
            transform: translateY(-50%) rotate(50deg);
        }
        
        .participation-info::after {
            right: 20%;
            transform: translateY(-50%) rotate(130deg);
        }

.social-share-container {
  display: flex;
  justify-content: space-between;
  margin: 40px 0;
  width: 100%;
}

.share-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24%;
  height: 45px;
  color: white;
  font-size: 26px;
  text-decoration: none;
  transition: all 0.3s ease;
  border-radius: 8px;
}

.share-button:hover {
	color: #fff;
}

.facebook {
  background-color: #1877f2;
}

.twitter {
  background-color: #000000;
}

.x-logo {
  height: 18px;
  width: auto;
}

.line {
  background-color: #06C755;
}

.instagram {
  background: linear-gradient(45deg, #0066cc 0%, #0099cc 25%, #00aadd 50%, #0088cc 75%, #0066aa 100%);
}

/* インスタグラムのスタイルを以下のはてなブックマークのスタイルに変更 */
.hatena {
  background-color: #00A4DE;
}
/* フォントを太く表示するためのスタイル */
.hatena {
  font-weight: bold;
  font-family: Arial, sans-serif;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .social-share-container {
    flex-wrap: wrap;
  }
  
  .share-button {
    width: 48%;
    margin-bottom: 10px;
    font-size: 16px;
  }
  
  .x-logo {
    height: 16px;
  }
}

@media (max-width: 480px) {
  .share-button {
    font-size: 14px;
    height: 40px;
  }
  
  .x-logo {
    height: 14px;
  }
}


/* ===============================================
   ゆら・らのトップページヒーローセクション専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #72bae7(水色), #c84e3(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-hero {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* ヒーローセクション */
.yurara-hero {
    background: none;
    color: #3D2914;
    padding: 0 0 30px 0;
    position: relative;
    overflow: hidden;
    min-height: 0px;
    display: flex;
    align-items: center;
}

.yurara-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="2" fill="rgba(255,255,255,0.1)"/></svg>') repeat;
    background-size: 50px 50px;
}

.yurara-hero-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 2;
    text-align: center;
}

/* テキストコンテンツ */
.yurara-hero-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0099cc;
    text-transform: uppercase;
}

.yurara-hero-title {
    font-size: 42px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    line-height: 1.3;
    color: #3D2914 !important;
}

.yurara-hero-description {
    font-size: 18px;
    line-height: 1.7;
    color: #3D2914;
    margin-bottom: 15px;
    font-weight: 100;
}

.yurara-hero-subtitle {
    font-size: 16px;
    line-height: 1.7;
    color: #5D4037;
    margin-bottom: 40px;
}

/* ボタン */
.yurara-hero-buttons {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

.yurara-hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-hero-btn-primary {
    background: #e74c3c;
    color: white;
    border-color: #e74c3c;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.yurara-hero-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

.yurara-hero-btn-secondary {
    background: white;
    color: #3D2914;
    border-color: #0066cc;
}

.yurara-hero-btn-secondary:hover {
    color: #3D2914;
	border-color: #FFE680;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

/* ビジュアルコンテンツ */
.yurara-hero-visual {
    position: relative;
    z-index: 1;
}

.yurara-hero-image {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    transform: rotate(2deg);
    transition: all 0.3s ease;
}

.yurara-hero-image:hover {
    transform: rotate(0deg);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
}

.yurara-hero-image img {
    width: 100%;
    height: 350px;
    object-fit: cover;
    display: block;
}

/* 画像がない場合のプレースホルダー */
.yurara-hero-image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    z-index: -1;
}

.yurara-hero-image::after {
    content: '農園での作業風景';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    z-index: 0;
    pointer-events: none;
}

/* 特徴アイコン */
.yurara-hero-features {
    display: flex;
    justify-content: space-around;
    margin-top: 30px;
    gap: 20px;
}

.yurara-hero-feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 20px;
    background: rgba(61, 41, 20, 0.1);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(61, 41, 20, 0.2);
    transition: all 0.3s ease;
    flex: 1;
}

.yurara-hero-feature:hover {
    background: rgba(61, 41, 20, 0.2);
    transform: translateY(-4px);
}

.yurara-hero-feature i {
    font-size: 24px;
    color: #3D2914;
}

.yurara-hero-feature span {
    font-size: 14px;
    font-weight: 600;
    color: #3D2914;
    text-align: center;
}

/* レスポンシブ対応 */
@media (max-width: 968px) {
    .yurara-hero-container {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .yurara-hero-visual {
        order: -1;
    }
}

@media (max-width: 768px) {
    .yurara-hero {
        padding: 0px 0 50px 0;
        min-height: 500px;
    }
    
    .yurara-hero-title {
        font-size: 32px !important;
    }
    
    .yurara-hero-subtitle {
        font-size: 16px;
    }
    
    .yurara-hero-buttons {
        justify-content: center;
        flex-direction: column;
        align-items: center;
		gap: 0px;
    }
    
    .yurara-hero-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
    
    .yurara-hero-image {
        transform: rotate(0deg);
    }
    
    .yurara-hero-image img {
        height: 250px;
    }
    
    .yurara-hero-features {
        flex-direction: column;
        gap: 15px;
    }
    
    .yurara-hero-feature {
        flex-direction: row;
        justify-content: center;
        padding: 15px;
    }
}

@media (max-width: 480px) {
    .yurara-hero {
        padding: 60px 0 30px 0;
        min-height: 400px;
    }
    
    .yurara-hero-title {
        font-size: 26px !important;
        margin-bottom: 20px !important;
    }
    
    .yurara-hero-subtitle {
        font-size: 15px;
        margin-bottom: 30px;
    }
    
    .yurara-hero-image img {
        height: 200px;
    }
    
    .yurara-hero-features {
        margin-top: 20px;
        gap: 10px;
    }
    
    .yurara-hero-feature {
        padding: 12px;
    }
    
    .yurara-hero-feature i {
        font-size: 20px;
    }
    
    .yurara-hero-feature span {
        font-size: 12px;
    }
	.yurara-hero-description {
		text-align: left;
}
}

/* 1カラムレイアウト対応 */
@media (max-width: 1200px) {
    .yurara-hero-container {
        max-width: 1000px;
    }
}

/* WordPressテーマとの競合回避 */
.yurara-hero * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-hero-title {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-hero-subtitle {
    font-family: inherit;
}

/* アニメーション効果 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.yurara-hero-container > * {
    animation: fadeInUp 0.8s ease-out;
}

.yurara-hero-visual {
    animation: fadeInUp 0.8s ease-out 0.2s both;
}

.yurara-hero-features {
    animation: fadeInUp 0.8s ease-out 0.4s both;
}









/*
==================================================
メインページのトップ画像（画像切替）
==================================================
*/
/* ヒーローセクションのCSS（header.phpに直接記述） */
.hero-section {
    position: relative;
    width: 100%;
    height: 800px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-slider {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.hero-slide {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 2s ease-in-out;
}

.hero-slide.active {
    opacity: 1;
}

.hero-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;  /* 上部を重視して表示 */
}

.decoration-circles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.circle {
    position: absolute;
    border-radius: 50%;
}

.circle-1 {
    width: 160px;
    height: 160px;
    top: 60px;
    left: 20px;
    background: rgba(255, 221, 100, 0.7);
	filter: blur(5px);
	box-shadow: 0 0 25px rgba(255, 221, 100, 0.3);
}

.circle-2 {
    width: 100px;
    height: 100px;
    top: 80px;
    right: 30px;
    background: rgba(240, 147, 124, 0.6);
	filter: blur(5px);
	box-shadow: 0 0 25px rgba(255, 221, 100, 0.3);
}

.circle-3 {
    width: 100px;
    height: 100px;
    bottom: 40px;
    left: 80px;
    background: rgba(0, 102, 204, 0.7);
	filter: blur(5px);
	box-shadow: 0 0 25px rgba(255, 221, 100, 0.3);
}

.circle-4 {
    width: 180px;
    height: 180px;
    bottom: 20px;
    right: 50px;
    background: rgba(255, 221, 100, 0.5);
	filter: blur(5px);
	box-shadow: 0 0 25px rgba(255, 221, 100, 0.3);
}

.hero-content {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: flex-start; /* 左寄せ */
    align-items: center;
    width: 100%;
    max-width: 100%;
    padding: 0 20px;
}

.hero-text-image {
    max-width: 800px;
}

.hero-text-image img {
    width: 100%;
    height: auto;
    max-width: 100%;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.2));
}

@media (max-width: 1100px) {
.hero-text-image {
    max-width: 600px;
}
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .hero-section {
        height: 800px;
        display: flex;
        align-items: flex-start;
    }

	.hero-slide {
        top: 0px;
}
    
    .hero-section .hero-content {
        justify-content: center;
        align-items: flex-start;
        padding-top: 60px;
        width: 100%;
        height: auto;
    }
    
    .hero-section .hero-text-image {
        max-width: 90%;
        margin-top: 0;
    }
    
    /* 丸1: 左上の大きな黄色い丸 */
    .circle-1 {
        width: 200px;
        height: 200px;
        top: 20px;
        left: -20px; /* 少し画面外にはみ出させる */
    }
    
    /* 丸2: 右上の緑っぽい丸 */
    .circle-2 {
        width: 150px;
        height: 150px;
        top: 70px;
        right: 0px;
        background: rgba(0, 102, 204, 0.6); /* 緑色に変更 */
    }
    
    /* 丸3: 左下の小さな丸 */
    .circle-3 {
        width: 120px;
        height: 120px;
        bottom: 50px; /* テキストの下あたり */
        left: 20px;
        background: rgba(255, 221, 100, 0.8); /* 黄色 */
    }
    
    /* 丸4: 右下のピンクっぽい丸 */
    .circle-4 {
        width: 150px;
        height: 150px;
        bottom: 60px;
        right: 0px;
        background: rgba(0, 153, 204, 0.6);
    }
}

@media screen and (max-width: 480px) {
    .hero-section {
        height: 650px;
    }
	
.hero-content {
	padding: 0 10px;
}
    
    .hero-text-image {
        max-width: 320px;
    }
	
    .hero-section .hero-text-image {
        max-width: 100%;
        margin-top: 0;
    }	
    
    .decoration-circles {
        display: none;
    }
	
    .circle-1, .circle-2, .circle-3, .circle-4 {
        transform: scale(0.7);
    }
}





/*
==================================================
ゆら・らについてセクション
==================================================
*/

/* セクション */
.about-section {
    position: relative;
    padding: 100px 0 180px 0;
    background: #fff;
    overflow: hidden;
}

/* 装飾円（共通） */
.about-deco {
    position: absolute;
    border-radius: 50%;
    z-index: 1;
}

.about-deco-yellow-tr {
    width: 140px;
    height: 140px;
    background: #0066cc;
    opacity: 0.7;
    top: 30px;
    right: 60px;
}

.about-deco-pink {
    width: 70px;
    height: 70px;
    background: #e8a090;
    opacity: 0.6;
    top: 140px;
    right: 180px;
}

.about-deco-yellow-bl {
    width: 130px;
    height: 130px;
    background: #0066cc;
    opacity: 0.7;
    bottom: 60px;
    left: 30px;
}

.about-deco-green {
    width: 80px;
    height: 80px;
    background: #4fb78a;
    opacity: 0.6;
    bottom: 180px;
    left: 180px;
}

/* 内部コンテナ */
.about-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
    width: 100%;
    padding: 0 80px;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}

/* 画像エリア */
.about-images {
    position: relative;
    width: 700px;
    min-width: 700px;
    height: 700px;
    flex-shrink: 0;
}

/* メイン画像 */
.about-img-main {
    width: 650px;
    height: 450px;
}

.about-img-main img {
    width: 100%;
    height: 100%;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    object-fit: cover;
}

/* サブ画像 */
.about-img-sub {
    position: absolute;
    width: 300px;
    height: 380px;
    right: -30px;
    top: 380px;
}

.about-img-sub img {
    width: 100%;
    height: 100%;
    border-radius: 16px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.12);
    object-fit: cover;
}

/* テキストエリア */
.about-text-area {
    flex: 1;
    max-width: 500px;
    padding-top: 10px;
}

.about-en {
    font-size: 16px;
    color: #0099cc;
    letter-spacing: 2px;
    margin-bottom: 10px;
    font-weight: 600;
}

.about-title {
    font-size: 34px;
    font-weight: bold;
    color: #333;
    margin: 0 0 30px 0;
}

.about-desc {
    margin-bottom: 35px;
}

.about-desc p {
    font-size: 17px;
    line-height: 2.1;
    color: #555;
    margin: 0;
}

.about-desc strong {
    color: #333;
    font-weight: 600;
}

.about-btn {
    display: inline-block;
    padding: 16px 45px;
    background: #0066cc;
    color: #333;
    text-decoration: none;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.about-btn:hover {
    background: #f5d054;
    transform: translateY(-2px);
}

/* 1320px以下で縦並び */
@media (max-width: 1320px) {
    .about-section {
        padding: 60px 0;
    }
    
    .about-inner {
        flex-direction: column;
        align-items: center;
        gap: 60px;
        padding: 0 20px;
    }
    
    .about-images {
        width: 100%;
        min-width: auto;
        max-width: 900px;
        height: auto;
        min-height: 600px;
    }
    
    .about-img-main {
        width: 100%;
        height: 450px;
    }
    
    .about-img-sub {
        width: 380px;
        height: 350px;
        right: -30px;
        top: 380px;
    }
    
    .about-text-area {
        max-width: 800px;
        text-align: center;
    }
    
    .about-title {
        font-size: 28px;
    }
    
    .about-desc p {
        font-size: 16px;
    }
}

/* スマホ */
@media (max-width: 600px) {
    .about-section {
        padding: 40px 0;
    }
    
    .about-inner {
        padding: 0 20px;
    }
    
    .about-images {
        height: 450px;
    }
    
    .about-img-main {
        height: 280px;
    }
    
    .about-img-sub {
        width: 200px;
        height: 260px;
        top: 240px;
    }
    
    .about-title {
        font-size: 24px;
    }
    
    .about-desc p {
        font-size: 14px;
        text-align: left;
    }
    
    .about-btn {
        padding: 14px 35px;
        font-size: 14px;
    }
    
    .about-deco-yellow-tr {
        width: 80px;
        height: 80px;
        right: 20px;
    }
    
    .about-deco-yellow-bl {
        width: 80px;
        height: 80px;
    }
    
    .about-deco-green {
        width: 50px;
        height: 50px;
        left: 150px;
        bottom: 150px;
    }
    
    .about-deco-pink {
        display: none;
    }
}





/*
==================================================
雲アニメーション（濃い水色版）
==================================================
*/

.yurara-mountains-bg-section {
    width: 100%;
    height: 300px;
    position: relative;
    overflow: hidden;
}

.yurara-mountains-bg-container {
    width: 100%;
    height: 100%;
    position: relative;
}

/* 山の背景画像 */
.yurara-mountain-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/wp-content/uploads/mountains-background.png');
    background-size: contain;
    background-position: center bottom;
    background-repeat: no-repeat;
    z-index: 1;
}

/* 雲のコンテナ */
.yurara-clouds {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 100;
    pointer-events: none;
}

/* 雲の基本スタイル（濃い水色・透明度なし） */
.yurara-cloud {
    position: absolute;
    background: rgb(230, 245, 255);
    border-radius: 50px;
    z-index: 101;
}

.yurara-cloud::before,
.yurara-cloud::after {
    content: '';
    position: absolute;
    background: rgb(230, 245, 255);
    border-radius: 50px;
}

/* 雲1 - 大きめ */
.yurara-cloud-1 {
    width: 120px;
    height: 50px;
    top: 20%;
    animation: yurara-cloud-flow-1 25s linear infinite;
}

.yurara-cloud-1::before {
    width: 70px;
    height: 60px;
    top: -25px;
    left: 25px;
}

.yurara-cloud-1::after {
    width: 80px;
    height: 55px;
    top: -20px;
    right: 25px;
}

/* 雲2 - 中くらい */
.yurara-cloud-2 {
    width: 100px;
    height: 40px;
    top: 35%;
    animation: yurara-cloud-flow-2 30s linear infinite;
    animation-delay: -10s;
}

.yurara-cloud-2::before {
    width: 60px;
    height: 50px;
    top: -20px;
    left: 20px;
}

.yurara-cloud-2::after {
    width: 65px;
    height: 45px;
    top: -15px;
    right: 20px;
}

/* 雲3 - 小さめ */
.yurara-cloud-3 {
    width: 90px;
    height: 35px;
    top: 10%;
    animation: yurara-cloud-flow-3 35s linear infinite;
    animation-delay: -20s;
}

.yurara-cloud-3::before {
    width: 55px;
    height: 45px;
    top: -18px;
    left: 18px;
}

.yurara-cloud-3::after {
    width: 60px;
    height: 40px;
    top: -12px;
    right: 18px;
}

/* 雲のゆっくり流れるアニメーション */
@keyframes yurara-cloud-flow-1 {
    0% {
        transform: translateX(-200px);
        opacity: 0;
    }
    5% {
        opacity: 1;
    }
    95% {
        opacity: 1;
    }
    100% {
        transform: translateX(calc(100vw + 200px));
        opacity: 0;
    }
}

@keyframes yurara-cloud-flow-2 {
    0% {
        transform: translateX(-200px);
        opacity: 0;
    }
    5% {
        opacity: 1;
    }
    95% {
        opacity: 1;
    }
    100% {
        transform: translateX(calc(100vw + 200px));
        opacity: 0;
    }
}

@keyframes yurara-cloud-flow-3 {
    0% {
        transform: translateX(-200px);
        opacity: 0;
    }
    5% {
        opacity: 1;
    }
    95% {
        opacity: 1;
    }
    100% {
        transform: translateX(calc(100vw + 200px));
        opacity: 0;
    }
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .yurara-mountains-bg-section {
        height: 200px;
    }
	
    .yurara-mountain-background {
        background-image: url('/wp-content/uploads/mountains-background-sp-01.png');
	}
    
    .yurara-cloud-1,
    .yurara-cloud-2,
    .yurara-cloud-3 {
        transform: scale(0.8);
    }
    
    .yurara-cloud-1 {
        animation-duration: 20s;
    }
    
    .yurara-cloud-2 {
        animation-duration: 25s;
    }
    
    .yurara-cloud-3 {
        animation-duration: 30s;
    }
}

@media screen and (max-width: 480px) {
    .yurara-mountains-bg-section {
        height: 200px;
		margin-top: -10px;
    }
    
    .yurara-cloud-1,
    .yurara-cloud-2,
    .yurara-cloud-3 {
        transform: scale(0.2); /* 0.6から0.4に変更してさらに小さく */
    }
    
    /* 各雲を個別に調整（0.6倍のサイズに） */
    .yurara-cloud-1 {
        width: 72px; /* 120px × 0.6 */
        height: 30px; /* 50px × 0.6 */
        animation-duration: 18s;
    }
    
    .yurara-cloud-1::before {
        width: 42px; /* 70px × 0.6 */
        height: 36px; /* 60px × 0.6 */
        top: -15px; /* -25px × 0.6 */
        left: 15px; /* 25px × 0.6 */
    }
    
    .yurara-cloud-1::after {
        width: 48px; /* 80px × 0.6 */
        height: 33px; /* 55px × 0.6 */
        top: -12px; /* -20px × 0.6 */
        right: 15px; /* 25px × 0.6 */
    }
    
    .yurara-cloud-2 {
        width: 60px; /* 100px × 0.6 */
        height: 24px; /* 40px × 0.6 */
        animation-duration: 22s;
    }
    
    .yurara-cloud-2::before {
        width: 36px; /* 60px × 0.6 */
        height: 30px; /* 50px × 0.6 */
        top: -12px; /* -20px × 0.6 */
        left: 12px; /* 20px × 0.6 */
    }
    
    .yurara-cloud-2::after {
        width: 39px; /* 65px × 0.6 */
        height: 27px; /* 45px × 0.6 */
        top: -9px; /* -15px × 0.6 */
        right: 12px; /* 20px × 0.6 */
    }
    
    .yurara-cloud-3 {
        width: 54px; /* 90px × 0.6 */
        height: 21px; /* 35px × 0.6 */
        animation-duration: 26s;
    }
    
    .yurara-cloud-3::before {
        width: 33px; /* 55px × 0.6 */
        height: 27px; /* 45px × 0.6 */
        top: -11px; /* -18px × 0.6 */
        left: 11px; /* 18px × 0.6 */
    }
    
    .yurara-cloud-3::after {
        width: 36px; /* 60px × 0.6 */
        height: 24px; /* 40px × 0.6 */
        top: -7px; /* -12px × 0.6 */
        right: 11px; /* 18px × 0.6 */
    }
	
	.yurara-mountain-background {

    background-image: url('/wp-content/uploads/mountains-background-sp.png');
	background-size: 150%; 	
	}
}















/*
==================================================
私たちの取り組みセクション（スライドショー付き）- 横幅拡張版
==================================================
*/
/* スライダーセクション */
.yurara-activities-section {
    padding: 80px 0;
    background-color: #ffffff;
    text-align: center;
    overflow: visible;
}

.yurara-activities-container {
    max-width: 1400px; /* 1200px → 1400px に拡張 */
    margin: 0 auto;
    padding: 0 20px; /* 40px → 20px に調整 */
    overflow: visible;
}

/* カードをクリック可能にする */
.yurara-activities-card-link {
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.yurara-activities-card-link:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

/* タイトル */
.yurara-activities-title {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 50px;
    gap: 15px;
}

.yurara-title-dots {
    color: #0066cc;
    font-size: 1.2rem;
    font-weight: bold;
}

/* Swiperカスタマイズ - 横幅拡張版 */
.yurara-swiper {
    max-width: 1400px; /* 1000px → 1400px に拡張 */
    margin: 0 auto 0 auto;
    overflow: visible;
    padding: 20px 0 !important; /* 上下にパディングを追加 */
	position: relative;
    z-index: 1;
}

.yurara-swiper .swiper-pagination {
    position: absolute;
    bottom: 10px;
}

/* スライダーのラッパーも調整 */
.yurara-swiper .swiper-wrapper {
    padding: 10px 0; /* 上下に余白を追加 */
}

/* 全てのスライド（デフォルト状態） */
.yurara-swiper .swiper-slide {
    transition: all 0.4s ease;
    opacity: 0.7;
    transform: scale(0.85);
    overflow: visible; /* 追加 */
}

/* アクティブスライド（真ん中の画像）を大きく */
.yurara-swiper .swiper-slide-active {
    opacity: 1;
    transform: scale(1.1);
    z-index: 2;
    overflow: visible;
}

/* 画像の基本スタイル + 角丸 - 横長長方形 */
.yurara-swiper .swiper-slide img {
    width: 100%;
    height: 280px; /* 280px → 200px に縮小（横長長方形効果） */
    object-fit: cover;
    border-radius: 20px; /* 角丸を追加 */
    transition: all 0.4s ease;
    display: block;
}

/* アクティブスライドの画像をさらに強調 */
.yurara-swiper .swiper-slide-active img {
    border-radius: 25px; /* アクティブ時はより大きな角丸 */
}

/* 矢印ボタンのカスタマイズ */
.yurara-swiper .swiper-button-prev,
.yurara-swiper .swiper-button-next {
    width: 50px;
    height: 50px;
    margin-top: -25px;
    color: #0066cc;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

.yurara-swiper .swiper-button-prev:hover,
.yurara-swiper .swiper-button-next:hover {
    background: rgba(255, 255, 255, 1);
    transform: scale(1.1);
    color: #c41e3a;
}

/* 矢印のサイズ調整 */
.yurara-swiper .swiper-button-prev:after,
.yurara-swiper .swiper-button-next:after {
    font-size: 20px;
    font-weight: bold;
}

/* 矢印の位置調整 */
.yurara-swiper .swiper-button-prev {
    left: -25px;
}

.yurara-swiper .swiper-button-next {
    right: -25px;
}

/* ドットカスタマイズ */
.yurara-swiper .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    background: rgba(0, 0, 0, 0.3);
    opacity: 1;
}

.yurara-swiper .swiper-pagination-bullet-active {
    background: #0066cc;
    transform: scale(1.3);
    box-shadow: 0 2px 8px rgba(255, 221, 100, 0.4);
}

/* テキスト部分 */
.yurara-activities-text {
    line-height: 1.8;
    margin-bottom: 40px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.yurara-activities-text p {
    margin-bottom: 15px;
    color: #333;
}

.yurara-activities-text strong {
    color: #c41e3a;
    font-weight: bold;
}

/* ボタン */
.yurara-activities-button {
    text-align: center;
}

.yurara-btn-more {
    display: inline-block;
    background-color: #0066cc;
    color: #333;
    padding: 15px 30px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.yurara-btn-more:hover {
    background-color: #FFE680;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    color: #333;
    text-decoration: none;
}

/* レスポンシブ対応 */
@media screen and (max-width: 900px) {
    .yurara-swiper .swiper-slide img {
        height: 220px;
        border-radius: 15px;
    }
    
    .yurara-swiper .swiper-slide-active img {
        border-radius: 20px;
    }
}

@media screen and (max-width: 768px) {
    .yurara-activities-section {
        padding: 80px 0;
    }
    
    .yurara-activities-container {
        padding: 0;
    }

    .yurara-swiper {
        overflow: visible;
        padding: 20px 0 !important;
    }
    
    .yurara-swiper .swiper-slide img {
        height: 280px; /* スマホでは正四角形に近い比率に戻す */
        width: 100%;
        object-fit: cover;
        border-radius: 12px;
    }
    .yurara-swiper .swiper-slide {
        opacity: 0.7;
        transform: scale(0.9);
        transition: all 0.3s ease;
    }
    
    /* アクティブスライドの設定もリセット */
    .yurara-swiper .swiper-slide-active {
        opacity: 1;
        transform: scale(1);
        z-index: 2;
    }    
    
    .yurara-swiper .swiper-slide-active img {
        border-radius: 18px;
    }
    
    .yurara-swiper .swiper-button-prev,
    .yurara-swiper .swiper-button-next {
        width: 40px;
        height: 40px;
        margin-top: -20px;
    }
    
    .yurara-swiper .swiper-button-prev:after,
    .yurara-swiper .swiper-button-next:after {
        font-size: 16px;
    }
    
    .yurara-swiper .swiper-button-prev {
        left: -15px;
    }
    
    .yurara-swiper .swiper-button-next {
        right: -15px;
    }
}

@media screen and (max-width: 480px) {
    .yurara-swiper .swiper-slide img {
        height: 250px;  /* スマホでは少し高めに */
        border-radius: 10px;
    }
    
    .yurara-swiper .swiper-slide-active img {
        border-radius: 15px;
    }
    
    /* スマホでは矢印を非表示にする場合 */
    .yurara-swiper .swiper-button-prev,
    .yurara-swiper .swiper-button-next {
        display: none;
    }
    .yurara-activities-text {
        text-align: left;
        margin: 0 20px;
    }    
}

/* タイトル部分 */
.yurara-activities-title {
    display: block;
    text-align: center;
    margin-bottom: 50px;
}

.activities-en {
    font-size: 16px;
    color: #0099cc;
    letter-spacing: 2px;
    margin-bottom: 10px;
    font-weight: 600;
}

.activities-heading {
    font-size: 34px;
    font-weight: bold;
    color: #333;
    margin: 0;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .activities-heading {
        font-size: 28px;
    }
}

@media (max-width: 480px) {
    .activities-heading {
        font-size: 24px;
    }
    
    .activities-en {
        font-size: 14px;
    }
}








/* ===============================================
   農福連携セクション タイトル中央寄せ＋白いドット修正CSS（クリーン版）
   =============================================== */

/* 農福連携セクション全体 */
.nofuku-renkei-section {
    padding: 80px 0;
    background: linear-gradient(to bottom, 
    #0066cc 0%,                    /* 上端: 完全な黄色 */
    #0066cc 20%,                   /* 20%地点: まだ黄色 */
    rgba(255, 221, 100, 0.3) 40%,  /* 40%地点: 薄い黄色 */
    rgba(255, 221, 100, 0) 70%     /* 70%地点: 完全透明 */
);
    position: relative;
}

.nofuku-renkei-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* タイトル部分を中央寄せ */
.nofuku-renkei-title-wrapper {
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
    display: block;
}

/* 農福連携タイトルのスタイル強化 */
.nofuku-renkei-title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    text-align: center;
    color: #333;
}

.nofuku-renkei-title .access-title-text {
    color: #333;
    font-size: 36px;
    font-weight: 700;
}

/* 農福連携セクションのドットを白にする（これだけ!important） */
.nofuku-renkei-section .access-dot {
    background: white !important;
}

/* コンテンツエリア（画像+テキスト）のレイアウト */
.nofuku-renkei-content {
    display: flex;
    align-items: center;
    gap: 60px;
    margin-top: 40px;
}

/* 画像エリア */
.nofuku-renkei-image {
    flex: 1;
    max-width: 500px;
}

.nofuku-renkei-image img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

/* テキストエリア */
.nofuku-renkei-text {
    flex: 1;
    max-width: 600px;
}

.nofuku-renkei-description {
    margin-bottom: 30px;
}

.nofuku-renkei-description p {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 15px;
    color: #3D2914;
    font-weight: 500;
}

/* ボタンスタイル */
.nofuku-btn {
    display: inline-block;
    padding: 15px 30px;
    background: white;
    color: #3D2914;
    text-decoration: none;
    border-radius: 50px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.nofuku-btn:hover {
    background: transparent;
    color: #3D2914;
    border-color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .nofuku-renkei-section {
        padding: 60px 0;
    }
    
    .nofuku-renkei-container {
        padding: 0 15px;
    }
    
    .nofuku-renkei-title-wrapper {
        margin: 40px 0;
    }
    
    .nofuku-renkei-title .access-title-text {
        font-size: 30px;
    }
    
    .nofuku-renkei-content {
        flex-direction: column;
        gap: 40px;
        text-align: center;
    }
    
    .nofuku-renkei-image,
    .nofuku-renkei-text {
        max-width: 100%;
    }
    
    .nofuku-renkei-description p {
        font-size: 16px;
        line-height: 1.7;
    }
}

@media (max-width: 480px) {
    .nofuku-renkei-section {
        padding: 40px 0;
    }
    
    .nofuku-renkei-title-wrapper {
        margin-bottom: 30px;
    }
    
    .nofuku-renkei-title .access-title-text {
        font-size: 26px;
    }
    
    .nofuku-renkei-content {
        gap: 30px;
    }
    
    .nofuku-btn {
        padding: 12px 24px;
        font-size: 14px;
    }
.nofuku-renkei-description {
    text-align: left;
}	
/* スマホ版で農福連携セクションのドットを非表示 */
    .nofuku-renkei-title .nofuku-white-dots {
        display: none;
    }
    
    .nofuku-renkei-title .nofuku-white-dot {
        display: none;
    }	
}

/* タイトル部分 */
.yurara-nofuku-title-container {
    text-align: center;
    margin-bottom: 20px;
}

.nofuku-en {
    font-size: 16px;
    color: #0099cc;
    letter-spacing: 2px;
    margin-bottom: 10px;
    font-weight: 600;
}

.nofuku-heading {
	font-size: 36px;
    font-weight: bold;
    color: #333;
    margin: 0;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .nofuku-heading {
        font-size: 28px;
    }
    
    .nofuku-en {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .nofuku-heading {
        font-size: 24px;
    }
    
    .nofuku-en {
        font-size: 13px;
    }
}









/*
==================================================
お問い合わせセクション（完全統合版）
==================================================
*/

/* セクション全体 */
.contact-clean-2024 {
    padding: 0;
    position: relative;
    overflow: hidden;
    background: #ffffff;
}

/* 波コンテナ */
.wave-container {
    position: relative;
    width: 100%;
    height: 140px;
    overflow: hidden;
    margin: 0;
    display: block;
    line-height: 0;
    font-size: 0;
    background: none; /* 波の背景 */
}

/* 波の設定 */
.wave {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 200%;
    height: 100%;
    background-repeat: repeat-x;
    background-size: contain;
}

.layer1 {
    background-image: url('https://kochi-ai.com/wp-content/uploads/wave-image-02.png');
    opacity: 0.8;
    animation: waveFlow1 30s linear infinite;
    z-index: 2;
}

.layer2 {
    background-image: url('https://kochi-ai.com/wp-content/uploads/wave-image-03.png');
    opacity: 0.5;
    animation: waveFlow2 40s linear infinite;
    z-index: 1;
}

@keyframes waveFlow1 {
    0% { background-position-x: 0; }
    100% { background-position-x: -960px; }
}

@keyframes waveFlow2 {
    0% { background-position-x: 0; }
    100% { background-position-x: -480px; }
}

/* 水色の背景（疑似要素で作成） */
.contact-clean-2024::before {
    content: '';
    position: absolute;
    top: 140px; /* 波の高さ分下から開始 */
    left: 0;
    width: 100%;
    height: calc(70% - 140px); /* 80%から波の高さを引く */
    background: linear-gradient(135deg, #98d8e8 0%, #85c5d6 100%);
    z-index: 1;
}

/* 白い背景（下部） */
.contact-clean-2024::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30%;
    background: #ffffff;
    z-index: 1;
}

/* コンテンツラッパー */
.contact-clean-wrapper {
    max-width: 600px;
    margin: 0 auto;
    padding: 80px 20px 40px 20px;
    position: relative;
    z-index: 2;
}

/* 白いカード */
.contact-clean-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 50px 40px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
    text-align: center;
    animation: fadeInUp 0.8s ease-out;
}

/* その他のスタイル（変更なし） */
.contact-clean-title {
    font-size: 1.8rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 30px;
    line-height: 1.3;
}

.contact-clean-description {
    margin-bottom: 40px;
    line-height: 1.8;
}

.contact-clean-description p {
    margin-bottom: 8px;
    font-size: 1rem;
    color: #555;
}

.contact-clean-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
}

.contact-clean-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 160px;
    border-radius: 15px;
    color: #333;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
    background: #0066cc;
}

.contact-clean-btn:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #333;
}

.contact-clean-text {
    font-size: 0.9rem;
    font-weight: bold;
    line-height: 1.2;
    color: #333;
    margin-bottom: 10px;
}

.contact-clean-icon {
    font-size: 24px;
    color: #f0c14b;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .wave-container {
        height: 100px;
        background: none;
    }
    
    .contact-clean-2024::before {
        top: 100px;
        height: calc(80% - 100px);
    }
    
    .contact-clean-wrapper {
        padding: 60px 20px;
    }
    
    .contact-clean-card {
        padding: 40px 30px;
        margin: 0 15px;
    }
    
    .contact-clean-buttons {
        flex-direction: column;
        gap: 15px;
    }
    
    .contact-clean-btn {
        width: 100%;
        max-width: 280px;
    }
}

@media screen and (max-width: 480px) {
    .wave-container {
        height: 50px;
        background: none;
    }
    
    .contact-clean-2024::before {
        top: 50px;
        height: calc(80% - 50px);
    }
    
    .contact-clean-wrapper {
        padding: 50px 20px;
    }
    
    .contact-clean-card {
        padding: 30px 20px;
        margin: 0 15px;
    }
    
    .contact-clean-btn {
        height: 140px;
        max-width: 200px;
    }
    
    .contact-clean-icon {
        font-size: 20px;
        width: 50px;
        height: 50px;
    }
    
    .contact-clean-text {
        font-size: 0.8rem;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}











/*
==================================================
公式SNSアカウントセクション
==================================================
*/
/* 公式SNSアカウントセクション */
.sns-section {
    padding: 60px 0 40px 0;
    background: none;
    text-align: center;
}

.sns-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

/* タイトル装飾エリア */
.sns-title-wrapper {
    margin-bottom: 50px;
}

/* タイトル */
.sns-title {
    font-size: 2.5rem;
    font-weight: bold;
    margin: 0 0 10px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* スラッシュ */
.sns-slash-left,
.sns-slash-right {
    font-size: 3rem;
    font-weight: bold;
    color: #333;
    line-height: 1;
	font-family: Arial, sans-serif;
    font-weight: normal;
}

.sns-title-text {
    color: #333;
}

.sns-title-sns {
    color: #0066cc;
    text-shadow: 2px 2px 0px #f0c14b;
    letter-spacing: 0.1em;
}

/* サブタイトル */
.sns-subtitle {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin: 10px 0 20px 0;
}

/* 説明文 */
.sns-description {
    font-size: 1.1rem;
    color: #555;
    margin: 0;
}

/* SNSアイコンエリア */
.sns-icons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

/* SNSアイコンリンク */
.sns-icon-link {
    text-decoration: none;
    transition: transform 0.3s ease;
}

.sns-icon-link:hover {
    transform: translateY(-5px);
}

/* SNSアイコン円形背景 */
.sns-icon-circle {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

/* Instagram */
.sns-instagram .sns-icon-circle {
    background: linear-gradient(45deg, #0066cc 0%, #0099cc 25%, #00aadd 50%, #0088cc 75%, #0066aa 100%);
}

.sns-instagram:hover .sns-icon-circle {
    box-shadow: 0 8px 25px rgba(240, 148, 51, 0.4);
}

/* Facebook */
.sns-facebook .sns-icon-circle {
    background: #1877f2;
}

.sns-facebook:hover .sns-icon-circle {
    box-shadow: 0 8px 25px rgba(24, 119, 242, 0.4);
}

/* X (Twitter) */
.sns-x .sns-icon-circle {
    background: #000000;
}

.sns-x:hover .sns-icon-circle {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .sns-section {
        padding: 60px 0;
    }
    
    .sns-title {
        font-size: 2rem;
    }
    
    .sns-slash-left,
    .sns-slash-right {
        font-size: 2.5rem;
    }
    
    .sns-subtitle {
        font-size: 1.5rem;
    }
    
    .sns-description {
        font-size: 1rem;
    }
    
    .sns-icons {
        gap: 20px;
    }
    
    .sns-icon-circle {
        width: 70px;
        height: 70px;
        font-size: 1.8rem;
    }
}

@media screen and (max-width: 480px) {
    .sns-section {
        padding: 50px 0;
    }
    
    .sns-title {
        font-size: 1.8rem;
        gap: 8px;
    }
    
    .sns-slash-left,
    .sns-slash-right {
        font-size: 2.2rem;
    }
    
    .sns-subtitle {
        font-size: 1.3rem;
    }
    
    .sns-description {
        font-size: 0.9rem;
    }
    
    .sns-icons {
        gap: 15px;
    }
    
    .sns-icon-circle {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }
}

/* フェードインアニメーション */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sns-title-wrapper {
    animation: fadeInUp 0.8s ease-out;
}

.sns-icons {
    animation: fadeInUp 0.8s ease-out 0.3s both;
}


















/* ===============================================
   YouTube公式チャンネルセクション
   =============================================== */

.yurara-youtube-section {
    padding: 30px 0 60px 0;
    background: transparent; /* 背景なし */
}

.yurara-youtube-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-youtube-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

/* 左側：テキストエリア */
.yurara-youtube-text {
    text-align: left;
}

.yurara-youtube-title {
    font-size: 32px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    line-height: 1.3;
}

.yurara-youtube-description {
    font-size: 18px;
    color: #666;
    line-height: 1.8;
    margin-bottom: 30px;
}

.yurara-youtube-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 15px 25px;
    background: #FF0000; /* YouTube赤 */
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(255, 0, 0, 0.3);
}

.yurara-youtube-btn:hover {
    background: #CC0000;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(255, 0, 0, 0.4);
    color: white;
    text-decoration: none;
}

.yurara-youtube-btn i {
    font-size: 20px;
}

/* 右側：動画エリア */
.yurara-youtube-video {
    position: relative;
}

.yurara-youtube-embed {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9のアスペクト比 */
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.yurara-youtube-embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .yurara-youtube-section {
        padding: 60px 0;
    }
    
    .yurara-youtube-content {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .yurara-youtube-text {
        text-align: center;
    }
    
    .yurara-youtube-title {
        font-size: 28px;
    }
    
    .yurara-youtube-description {
        font-size: 16px;
    }
    
    .yurara-youtube-btn {
        padding: 12px 20px;
        font-size: 15px;
    }
}














/*
==================================================
アクセスセクション
==================================================
*/
/* アクセスセクション */
.access-section {
    padding: 80px 0;
    background: #fff;
    text-align: center;
}

.access-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

/* タイトル */
.access-title-wrapper {
    margin-bottom: 30px;
}

.access-title {
    font-size: 2.5rem;
    font-weight: bold;
    color: #333;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.access-title-text {
    letter-spacing: 0.1em;
}

/* ドット装飾 */
.access-dots-left,
.access-dots-right {
    display: flex;
    gap: 8px;
    align-items: center;
}

.access-dot {
    width: 12px;
    height: 12px;
    background: #0066cc;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 2px 4px rgba(240, 193, 75, 0.3);
}

/* 住所情報 */
.access-info {
    margin-bottom: 40px;
}

.access-postal {
    font-size: 1.2rem;
    font-weight: bold;
    color: #333;
    margin: 0 0 8px 0;
}

.access-address {
    font-size: 1.3rem;
    font-weight: bold;
    color: #333;
    margin: 0;
    letter-spacing: 0.02em;
}

/* 地図コンテナ */
.access-map-container {
    margin-bottom: 50px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}

/* 地図エリア */
.access-map {
    width: 100%;
    height: 400px;
    background: #e9ecef;
    position: relative;
}

/* 地図プレースホルダー（Google Maps埋め込み前） */
.map-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #6c757d;
}

.map-placeholder p {
    font-size: 1.1rem;
    margin: 0 0 10px 0;
}

.map-placeholder small {
    font-size: 0.9rem;
    color: #868e96;
}

/* Google Maps iframe用のスタイル */
.access-map iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* 交通アクセス詳細 */
.access-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    text-align: left;
}

.access-detail-item {
    background: #ffffff;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.access-detail-title {
    font-size: 1.1rem;
    font-weight: bold;
    color: #333;
    margin: 0 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid #0066cc;
}

.access-detail-text {
    font-size: 1rem;
    color: #555;
    line-height: 1.6;
    margin: 0;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .access-section {
        padding: 60px 0;
    }
    
    .access-title {
        font-size: 2rem;
        gap: 15px;
    }
    
    .access-postal {
        font-size: 1.1rem;
    }
    
    .access-address {
        font-size: 1.2rem;
    }
    
    .access-map {
        height: 300px;
    }
    
    .access-details {
        gap: 20px;
        text-align: center;
    }
    
    .access-detail-item {
        padding: 20px;
    }
}

@media screen and (max-width: 480px) {
    .access-section {
        padding: 50px 0;
    }
    
    .access-title {
        font-size: 1.8rem;
        gap: 10px;
    }
    
    .access-dot {
        width: 10px;
        height: 10px;
    }
    
    .access-dots-left,
    .access-dots-right {
        gap: 6px;
    }
    
    .access-postal {
        font-size: 1rem;
    }
    
    .access-address {
        font-size: 1.1rem;
    }
    
    .access-map {
        height: 250px;
    }

    .access-details {
        grid-template-columns: 1fr;
    }
	
    .access-detail-item {
        padding: 15px;
    }
    
    .access-detail-title {
        font-size: 1rem;
    }
    
    .access-detail-text {
        font-size: 0.9rem;
    }
}

/* フェードインアニメーション */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.access-title-wrapper {
    animation: fadeInUp 0.8s ease-out;
}

.access-info {
    animation: fadeInUp 0.8s ease-out 0.2s both;
}

.access-map-container {
    animation: fadeInUp 0.8s ease-out 0.4s both;
}

.access-details {
    animation: fadeInUp 0.8s ease-out 0.6s both;
}

/* タイトル部分 */
.access-title-wrapper {
    text-align: center;
    margin-bottom: 30px;
}

.access-en {
    font-size: 16px;
    color: #0099cc;
    letter-spacing: 2px;
    margin-bottom: 10px;
    font-weight: 600;
}

.access-heading {
    font-size: 34px;
    font-weight: bold;
    color: #333;
    margin: 0;
}

/* レスポンシブ */
@media (max-width: 768px) {
    .access-heading {
        font-size: 28px;
    }
    
    .access-en {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .access-heading {
        font-size: 24px;
    }
    
    .access-en {
        font-size: 13px;
    }
}







/* ===============================================
   タイトル統一用追加CSS
   アクセスセクションと同じドット装飾デザインを他のセクションにも適用
   =============================================== */

/* 基本のアクセスタイトルデザイン（既存のまま） */
.access-title {
    font-size: 36px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 40px;
    color: #333;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px ;
}

.access-title-text {
    font-size: 36px;
    font-weight: 700;
    color: #333;
    white-space: nowrap;
}

.access-dots-left,
.access-dots-right {
    display: flex;
    gap: 8px;
}

.access-dot {
    width: 8px;
    height: 8px;
    background: #0066cc;
    border-radius: 50%;
}

/* 農福連携セクションのタイトル特別調整 */
.nofuku-renkei-title {
    color: #333;
    margin-bottom: 30px;
}

.nofuku-renkei-title .access-title-text {
    color: #333 ;
}

/* ゆら・らについてセクションのタイトル調整 */
.yurara-about-title {
    margin-bottom: 30px;
}


/* レスポンシブ対応 */
@media (max-width: 768px) {
    .access-title {
        font-size: 24px;
        gap: 15px;
        flex-direction: column;
    }
    
    .access-title-text {
        font-size: 30px;
    }
    
    .access-dots-left,
    .access-dots-right {
        gap: 6px;
    }
    
    .access-dot {
        width: 6px;
        height: 6px;
    }
    
    /* モバイル時は縦並びにならないようにする場合 */
    .access-title {
        flex-direction: row;
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .access-title {
        font-size: 20px;
        gap: 8px;
    }
    
    .access-title-text {
        font-size: 26px;
    }
    
    .access-dots-left,
    .access-dots-right {
        gap: 4px;
    }
    
    .access-dot {
        width: 5px;
        height: 5px;
    }
}

















/*
==================================================
都市景観セクション
==================================================
*/
.cityscape-section {
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.cityscape-container {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cityscape-image {
    width: 100%;
    height: auto;
	max-height: auto; /* 高さを調整 */
    object-fit: cover;
    object-position: center;
    display: block;
    margin: 0;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .cityscape-image {
        max-height: 200px; /* 120px から 200px に増加 */
    }
}

@media screen and (max-width: 480px) {
    .cityscape-image {
        width: auto; /* 幅を自動調整 */
        height: 90px; /* 高さを固定 */
        max-height: none; /* max-heightを削除 */
        max-width: none; /* 横幅制限も削除 */
        object-fit: cover; /* 画像を切り抜いて表示 */
    }
}









/*
==================================================
ゆら・らについてページ
==================================================
*/
/* ゆら・らについてページ（自然で親しみやすいデザイン） */

/* 共通コンテナ */

/* 空のpタグを非表示 */
.message-content p:empty,
.message-text p:empty,
.message-photo p:empty {
    display: none;
}

/* または高さを0に */
.message-content p:empty {
    height: 0;
    margin: 0;
    padding: 0;
    line-height: 0;
}

.about-message {
	background-color: #fff;
	padding-bottom: 20px;
    position: relative;
    overflow: hidden; /* 装飾画像がはみ出さないように */	
}

/* 右上の装飾 */
.about-message::before {
    content: '';
    position: absolute;
    top: 20px;
    right: 20px;
    width: 200px;
    height: 260px;
    background-image: url('https://kochi-ai.com/wp-content/uploads/decoration-01.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    pointer-events: none;
    opacity: 0.2; /* 控えめに表示 */
}

@media (max-width: 768px) {
.about-message::before {
        top: 20px;
        right: -80px;
}
}

@media (max-width: 480px) {
.about-message::before {
    background-image: none;	
}
}

/* 左下の装飾 */
.about-message::after {
    content: '';
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 200px;
    height: 260px;
    background-image: url('https://kochi-ai.com/wp-content/uploads/decoration-01.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    pointer-events: none;
    opacity: 0.2;
}

@media (max-width: 480px) {
.about-message::after {
    bottom: 0px;
    left: 0px;
    width: 130px;
    height: 170px;
	z-index: 10;
}
}

.about-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 50px 20px 50px 20px;
    position: relative;
    z-index: 2;	
}

/* ページヘッダー */
.about-hero {
    padding: 80px 0 60px;
    text-align: center;
    color: #333;
    position: relative;
    overflow: hidden;
}

.about-hero::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120"><path d="M0,100 C300,20 600,80 900,60 C1000,50 1100,70 1200,60 L1200,120 L0,120 Z" fill="%23ffffff"/></svg>') no-repeat center bottom;
    background-size: cover;
}

.about-hero-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.about-page-title {
    font-size: 3rem;
    font-weight: 600;
    margin-bottom: 20px;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
    letter-spacing: 0.02em;
}

.about-page-subtitle {
    font-size: 1.2rem;
    line-height: 1.8;
    font-weight: 400;
    background: rgba(255, 255, 255, 0.9);
    color: #333;
    padding: 15px 25px;
    border-radius: 25px;
    display: inline-block;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* セクション共通 */
.about-page section {
	padding: 50px 0 80px 0;
    position: relative;
}

.about-page section:nth-child(even) {
}

.about-section-title {
    font-size: 2.5rem;
    font-weight: 600;
    text-align: center;
    margin-bottom: 30px;
    color: #333;
    position: relative;
    letter-spacing: 0.02em;
}

.about-section-title::after {

}

/* 代表メッセージ */
.message-content {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 50px;
    background: white;
    padding: 40px;
    border-radius: 20px;
    position: relative;
	margin: 50px 0;
}

.message-photo {
    text-align: center;
    position: relative;
}

.representative-photo {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    margin-bottom: 20px;

}

.representative-name {
    font-size: 1.3rem;
    font-weight: 600;
    color: #333;
    letter-spacing: 0.02em;
}

.message-text p {
    font-size: 1.05rem;
    line-height: 1.8;
    margin-bottom: 0;
    color: #555;
    font-weight: 400;
}

.message-signature {
    font-weight: 600;
    color: #0099cc;
    margin-top: 30px;
    font-size: 1.1rem;
    text-align: right;
}

/* 法人概要 */
.overview-grid {
    display: flex;
    justify-content: center;
}

.overview-card {
    background: white;
    padding: 35px;
    border-radius: 15px;
    position: relative;
    transition: all 0.3s ease;
    max-width: 800px;
    width: 100%;
}

.overview-card-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 3px solid #0066cc;
}

.overview-list {
    display: grid;
    gap: 15px;
}

.overview-list dt {
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
}

.overview-list dd {
    color: #666;
    margin-left: 0;
    padding-left: 20px;
    border-left: 3px solid #87CEEB;
    line-height: 1.6;
}

/* 名前の由来 */
/* 「ゆら・ら」の由来セクション用 */
.about-origin .origin-content p:empty,
.about-origin p:empty {
    display: none !important;
}

/* または、より広範囲に適用 */
.about-origin p:empty {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.about-origin {
	background-color: #f9f9f9;
	padding-bottom: 70px !important;
}
	
	
.origin-content {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 50px;
    align-items: center;
    background: white;
    padding: 50px;
    border-radius: 20px;
}

.origin-text {
    font-size: 1.2rem;
    line-height: 2;
    color: #333;
    font-weight: 400;
}

.origin-meaning {
    font-size: 1.4rem;
    font-weight: 600;
    color: #0099cc;
    margin-bottom: 20px;
}

.origin-emphasis {
    font-weight: 500;
    color: #333;
    margin-top: 20px;
}

.origin-logo {
    text-align: center;
}

.logo-image-01 {
    width: 380px;
    height: auto;
    margin-bottom: 20px;
    filter: drop-shadow(0 4px 15px rgba(0, 0, 0, 0.1));
}

.logo-description {
    font-size: 0.9rem;
    color: #777;
    line-height: 1.6;
}

/* 理念 */
.mission-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
	margin: 60px 0 20px 0;
}

.mission-card {
    background: white;
    padding: 40px 30px;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    text-align: center;
    transition: all 0.3s ease;
}

.mission-icon {
    width: 80px;
    height: 80px;
    background: #0066cc;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 2rem;
    color: #fff;
}

.mission-title {
    font-size: 1.4rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}

.mission-text {
    color: #666;
    line-height: 1.8;
    text-align: left;
    font-weight: 400;
}

.mission-list {
    list-style: none;
    padding: 0;
    text-align: left;
}

.mission-list li {
    padding: 8px 0;
    color: #666;
    line-height: 1.6;
    font-weight: 400;
    position: relative;
    padding-left: 30px; /* アイコン分の余白を確保 */
}

.mission-list li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px; /* 位置を調整 */
    width: 22px;
    height: 22px;
    background: #0066cc;
    border-radius: 50%;
}

.mission-list li:after {
    content: '\f105';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 7px;
    top: 11px; /* 位置を調整 */
    color: white;
    font-size: 14px;
    line-height: 20px; /* 縦方向の中央揃え */
}

/* 理念セクション用の追加スタイル */
.mission-card-center {
    background: white;
    padding: 40px 30px;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    text-align: center;
    transition: all 0.3s ease;
    margin: 0 auto 40px auto;
}

.mission-card-full {
    background: white;
    padding: 40px 30px;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    text-align: center;
    transition: all 0.3s ease;
    margin-bottom: 30px;
}

.mission-list-center {
    list-style: none;
    padding: 0;
	max-width: 300px;
    margin: 0 auto;
}

.mission-subtitle {
    color: #777;
    font-size: 0.9rem;
    margin-bottom: 20px;
    font-style: italic;
}

/* 事業所の特徴（ステップ形式） */
.about-features {
	background-color: #f9f9f9;
	padding-bottom: 20px;	
}

.step-container {
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}

.step-item {
    position: relative;
    margin-bottom: 60px;
}

.step-item:last-child {
    margin-bottom: 0;
}

.step-header {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}

.step-number {
    width: 80px;
    height: 80px;
    background: #0066cc;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
    border: 4px solid white;
}

.step-item:nth-child(2) .step-number {
    background: #4fb78a;
}

.step-num {
    font-size: 1.8rem;
    font-weight: bold;
    color: white;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.step-line {
    flex: 1;
    height: 4px;
    background: linear-gradient(90deg, #0066cc 0%, rgba(255, 221, 100, 0.3) 100%);
    margin-left: 20px;
    border-radius: 2px;
    position: relative;
}

.step-final .step-line {
    display: none;
}

.step-content {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 40px;
    align-items: anchor-center;
    background: white;
    padding: 40px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
    border-left: 5px solid #0066cc;
    transition: all 0.3s ease;
}

.step-item:nth-child(2) .step-content {
    border-left: 5px solid #4fb78a;
}

.step-final .step-content {
    border-left: 5px solid #0066cc;
}

.step-image {
    position: relative;
}

.step-photo {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

.step-text {
    padding: 10px 0;
}

.step-title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
    position: relative;
	padding: 0 0 0 10px;
	margin-block-start: 0;
}

.step-title::before {
    content: '';
    position: absolute;
    left: -10px !important;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #0066cc;
    border-radius: 2px;
}

.step-item:nth-child(even) .step-title::before {
    background: #4fb78a;
    left: -10px;
    left: auto;
}

.step-final .step-title::before {
    background: #0099cc;
    left: -10px;
    right: auto;
}

.step-description {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #666;
    margin-bottom: 20px;
}

.step-points {
    list-style: none;
    padding: 0;
    margin: 0;
}

.step-points li {
    padding: 8px 0;
    color: #555;
    position: relative;
    padding-left: 25px;
    line-height: 1.6;
}

.step-points li:before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #0066cc;
    font-weight: bold;
    font-size: 1.1rem;
}

.step-item:nth-child(2) .step-points li:before {
    color: #87CEEB;
}

/* 6次産業化フロー（ステップ版） */
.industry-flow {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 25px;
    padding: 20px;
    border-radius: 15px;
	flex-wrap: wrap; /* スマホ対応 */
}

.flow-step {
    width: 100%;
	max-width: 280px;  /* 最大幅を制限 */
    height: 80px;
    display: flex;
    align-items: center;
    background: white;
    border: 3px solid #4fb78a;
    border-radius: 25px;
    padding: 15px 20px;
    box-sizing: border-box;
    position: relative;
    box-shadow: 0 4px 15px rgba(125, 211, 192, 0.2);
}

.flow-number {
    width: 50px;
    height: 50px;
    background: #4fb78a;
    color: white;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;
    margin-right: 20px;
    flex-shrink: 0;
}

.flow-text {
    font-size: 18px;
    color: #333;
    font-weight: 500;
    letter-spacing: 0.5px;
}

.industry-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    margin-top: 25px;
    padding: 30px 20px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 15px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.flow-arrow-01 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 25px;
    position: relative;
}

.flow-arrow-01::before {
    content: '';
    width: 3px;
    height: 20px;
    background: #4fb78a;
    position: absolute;
}

.flow-arrow-01::after {
    content: '';
    position: absolute;
    bottom: -2px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #4fb78a;
}

/* 沿革 */
.history-timeline {
    max-width: 700px;
    margin: 0 auto;
    position: relative;
}

.history-timeline::before {
    content: '';
    position: absolute;
    left: 180px;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #0066cc;
}

.timeline-item {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 30px;
    margin-bottom: 40px;
    position: relative;
}

.timeline-year {
    font-size: 1.8rem;
    font-weight: bold;
    color: #333;
    text-align: right;
    padding-right: 30px;
    position: relative;
}

.timeline-year::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 15px;
    width: 16px;
    height: 16px;
    background: #0066cc;
    border-radius: 50%;
    box-shadow: 0 0 0 3px #0066cc;
}

.timeline-content {
    background: white;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.timeline-content h3 {
    font-size: 1.3rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

.timeline-content p {
    color: #666;
    line-height: 1.7;
}

/* お問い合わせ誘導 */
.about-contact {
    width: 100vw; /* ビューポート幅いっぱい */
    margin-left: calc(-50vw + 50%); /* 中央寄せコンテナから画面幅いっぱいに拡張 */
    padding: 80px 0;
    background: #98d8e8; /* 背景色を確実に適用 */
	color: white; /* 文字色を白に指定 */
}

/* コンテナは中央寄せを維持 */
.about-contact .about-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 2;
}

.contact-cta {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.contact-cta-title {
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 20px;
	margin-top: 0px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.contact-cta-text {
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 40px;
    opacity: 0.95;
}

.contact-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
}

.contact-btn {
    display: inline-block;
    padding: 15px 35px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.contact-btn-primary {
    background: #0066cc;
    color: #333;
	border: 2px solid #0066cc;
}

.contact-btn-primary:hover {
    background: #fff;
    transform: translateY(-2px);
	color: #333;
	border: 2px solid #0066cc;
}

.contact-btn-secondary {
    background: transparent;
    color: white;
    border: 2px solid white;
}

.contact-btn-secondary:hover {
    background: white;
    color: #333;
    transform: translateY(-2px);
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
	.about-container {
        padding: 0;
    }
    .about-page-title {
        font-size: 2.2rem;
    }
    
    .about-page-subtitle {
        font-size: 1rem;
    }
    
    .about-section-title {
        font-size: 2rem;
    }
    
    .message-content {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: left;
		padding: 40px 10px;
    }
    
    .representative-photo {
        width: 150px;
        height: 150px;
    }
    
    .overview-grid {
        grid-template-columns: 1fr;
    }
    
    .origin-content {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: left;
		padding: 50px 10px;
    }
    
    .mission-grid {
        grid-template-columns: 1fr;
    }
    
    .step-content,
    .step-item:nth-child(even) .step-content {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    
    .step-image {
        order: 0;
    }
    
    .step-header {
        justify-content: center;
    }
    
    .step-line {
        display: none;
    }
    
    .step-title::before,
    .step-item:nth-child(2) .step-title::before {
        left: -10px;
        right: auto;
    }
    
    .industry-flow {
        justify-content: center;
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .flow-step {
        min-width: 70px;
        padding: 12px;
    }
    
    .flow-number {
        font-size: 1rem;
    }
    
    .flow-text {
        font-size: 0.9rem;
    }
    
    .flow-arrow-01 {
        font-size: 1.2rem;
    }
    
    .timeline-item {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .timeline-year {
        text-align: center;
        padding-right: 0;
    }
    
    .history-timeline::before {
        display: none;
    }
    
    .timeline-year::after {
        display: none;
    }
    
    .contact-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .contact-btn {
        width: 250px;
    }
	    .about-contact {
        padding: 60px 0;
    }
    
    .about-contact .about-container {
        padding: 0 15px;
    }
}

@media screen and (max-width: 480px) {
    .about-hero {
        padding: 60px 0 40px;
    }
    
    .about-page-title {
        font-size: 1.8rem;
    }
    
    .about-page-subtitle {
        font-size: 0.9rem;
    }
    
    .about-page section {
        padding: 60px 0;
    }
    
    .about-section-title {
        font-size: 1.8rem;
    }
    
    .overview-card,
    .mission-card {
        padding: 25px 20px;
    }
    
    .step-number {
        width: 60px;
        height: 60px;
    }
    
    .step-num {
        font-size: 1.4rem;
    }
    
    .step-content {
        padding: 25px 20px;
    }
    
    .step-photo {
        height: 180px;
    }
    
    .step-title {
        font-size: 1.5rem;
    }
    
    .step-description {
        font-size: 1rem;
    }
    
    .contact-cta-title {
        font-size: 1.8rem;
    }
    
    .contact-cta-text {
        font-size: 1rem;
		text-align: left;
    }
    .flow-step {
        max-width: 250px;
        height: 70px;
        padding: 10px 15px;
    }
    
    .flow-number {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
    
    .flow-text {
        font-size: 16px;
    }
}


















/*
==================================================
運営者情報で使ってる表
==================================================
*/
/* table01 */
#table01 {
    max-width: 800px;
    margin: 0 auto;
	font-size:20px;
}
@media screen and (max-width: 960px) {
#table01 {
    max-width: 800px;
    margin: 0 auto;
	padding:0;
}
}


#table01 tr {
    border-bottom: 1px solid #b5b1b1;
}

#table01 th,
#table01 td {
    padding: 24px 0;
    border: none;
	padding:20px 10px;
	vertical-align:middle;

}

#table01 th {
  width: 30%;
	background-color: #fff;
	text-align:left;
}

/* sp */
@media only screen and (max-width: 760px) {
  #table01 th,
  #table01 td {
    width: 100%;
    display: block;
	  font-size:1.0em;
  }

  #table01 th {
    width: 100%;
	background-color: #F5F5F5;
  }

  #table01 td {
    padding-top: 10px;
  }
	
  #table01 tr {
    border-bottom: none;
  }
}


.table_kakomi {
	width:100%;
}
.table_kakomi_01 {
	margin:10px;
	padding:0;
}


































/*
==================================================
活動紹介ページ専用CSS（独自デザイン）
==================================================
*/
/* ===============================================
   ゆら・らの活動詳細ページ専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #c84e3(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-activities-header,
.yurara-activities-overview,
.yurara-activities-schedule,
.yurara-activities-detail,
.yurara-activities-info,
.yurara-activities-cta {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* ヘッダーセクション */
.yurara-activities-header {
    background: linear-gradient(135deg, #0066cc 0%, #FFE680 100%);
    color: #333;
    padding: 80px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.yurara-activities-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="2" fill="rgba(255,255,255,0.3)"/></svg>') repeat;
    background-size: 50px 50px;
}

.yurara-activities-header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.yurara-activities-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0099cc;
}

.yurara-activities-title {
    font-size: 48px;
    font-weight: 700;
    margin: 20px 0 20px 0;
    letter-spacing: 2px;
    color: #333;
}

.yurara-activities-title h2 {
    font-size: 34px;
    font-weight: bold;
    color: #333;
    margin: 0;
}

.yurara-activities-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: #555;
    max-width: 800px;
    margin: 0 auto;
}

/* 活動概要セクション */
.yurara-activities-overview {
    padding: 80px 0;
    background-color: white;
}

.yurara-activities-overview-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-activities-overview-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.yurara-activities-overview-item {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    border: 2px solid transparent;
	display: block;
    text-decoration: none;
	cursor: pointer;
}

.yurara-activities-overview-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.15);
}

.yurara-cleaning {
    border-color: #72bae7;
}

.yurara-cleaning:hover {
    border-color: #72bae7;
    background: rgba(114, 186, 231, 0.05);
}

.yurara-farming {
    border-color: #4fb78a;
}

.yurara-farming:hover {
    border-color: #4fb78a;
    background: rgba(79, 183, 138, 0.05);
}

.yurara-light-work {
    border-color: #0066cc;
}

.yurara-light-work:hover {
    border-color: #0066cc;
    background: rgba(255, 221, 100, 0.1);
}

.yurara-activities-overview-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    color: white;
    font-size: 32px;
}

.yurara-cleaning .yurara-activities-overview-icon {
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
}

.yurara-farming .yurara-activities-overview-icon {
    background: linear-gradient(135deg, #4fb78a, #3a9270);
}

.yurara-light-work .yurara-activities-overview-icon {
    background: linear-gradient(135deg, #0066cc, #FFE680);
    color: #333;
}

.yurara-activities-overview-item h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 16px 0 !important;
    color: #333 !important;
}

.yurara-activities-overview-item p {
    font-size: 16px;
    line-height: 1.6;
    color: #666;
    margin: 0;
}

/* 1日のスケジュールセクション */
.yurara-activities-schedule {
    padding: 80px 0;
    background: linear-gradient(135deg, #4fb78a 0%, #3a9270 100%);
    color: white;
}

.yurara-activities-schedule-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-activities-schedule-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 60px !important;
    color: white !important;
}

.yurara-activities-schedule-timeline {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
}

.yurara-activities-schedule-timeline::before {
    content: '';
    position: absolute;
    left: 80px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(255, 255, 255, 0.3);
}

.yurara-activities-schedule-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 40px;
    position: relative;
}

.yurara-activities-schedule-time {
    flex-shrink: 0;
    width: 80px;
    font-size: 18px;
    font-weight: 700;
    color: #0066cc;
    position: relative;
    z-index: 2;
}

.yurara-activities-schedule-time::after {
    content: '';
    position: absolute;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #0066cc;
}

.yurara-activities-schedule-desc {
    margin-left: 40px;
    background: rgba(255, 255, 255, 0.1);
    padding: 20px 24px;
    border-radius: 12px;
    backdrop-filter: blur(10px);
    flex: 1;
}

.yurara-activities-schedule-desc h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 8px 0 !important;
    color: white !important;
}

.yurara-activities-schedule-desc p {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin: 0;
}

/* 活動詳細セクション */
.yurara-activities-detail {
    padding: 80px 0;
}

.yurara-cleaning-detail {
    background-color: white;
}

.yurara-farming-detail {
    background: linear-gradient(135deg, rgba(79, 183, 138, 0.05) 0%, rgba(79, 183, 138, 0.1) 100%);
}

.yurara-light-work-detail {
    background-color: white;
}

.yurara-activities-detail-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-activities-detail-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.yurara-activities-detail-text {
    order: 1;
}

.yurara-farming-detail .yurara-activities-detail-text {
    order: 1;
}

.yurara-activities-detail-image {
    order: 2;
}

.yurara-farming-detail .yurara-activities-detail-image {
    order: 2;
}

.yurara-activities-detail-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    color: white;
    font-size: 24px;
}

.yurara-cleaning-detail .yurara-activities-detail-icon {
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
}

.yurara-farming-detail .yurara-activities-detail-icon {
    background: linear-gradient(135deg, #4fb78a, #3a9270);
}

.yurara-light-work-detail .yurara-activities-detail-icon {
    background: linear-gradient(135deg, #0066cc, #FFE680);
    color: #333;
}

.yurara-activities-detail-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    margin: 0 0 30px 0 !important;
    color: #333 !important;
}

.yurara-activities-detail-description h3 {
    font-size: 24px !important;
    font-weight: 600 !important;
    margin: 0 0 16px 0 !important;
    color: #333 !important;
}

.yurara-activities-detail-description h4 {
    font-size: 20px !important;
    font-weight: 600 !important;
    margin: 30px 0 12px 0 !important;
    color: #4fb78a !important;
}

.yurara-activities-detail-description p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 20px;
}

.yurara-activities-detail-description ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
}

.yurara-activities-detail-description li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
}

.yurara-activities-detail-description li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #0066cc;
    font-size: 12px;
    top: 4px;
}

.yurara-activities-detail-image {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
}

.yurara-activities-detail-image img {
    width: 100%;
    height: auto;
    display: block;
}





/* 利用案内セクション */
.yurara-activities-info {
    padding: 80px 0;
    background: none;
}

.yurara-activities-info-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-activities-info-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 60px !important;
    color: #333 !important;
}

.yurara-activities-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 40px;
}

.yurara-activities-info-item {
    background: rgba(255, 255, 255, 0.9);
    padding: 30px;
    border-radius: 16px;
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.5);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.yurara-activities-info-item h3 {
    font-size: 20px !important;
    font-weight: 700 !important;
    margin-bottom: 16px !important;
    color: #c84e3 !important;
	margin-block-start: 0;
	border-left: solid 4px #0066cc;
	padding: 0 0 0 10px;
}

.yurara-activities-info-item p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin: 0;
}

.yurara-activities-info-item small {
    font-size: 14px;
    color: #777;
}

/* CTAセクション */
/* 波の画像セクション */
.yurara-activities-wave {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-bottom: 0 !important;
    height: 156px; /* 波の高さに応じて調整 */
    background-image: url('https://kochi-ai.com/wp-content/uploads/wave-image-02.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center bottom;
}

.yurara-activities-cta {
    padding: 80px 0;
    background: #98d8e8;
    color: white;
    text-align: center;
    margin-top: 0 !important; /* 波との隙間をなくす */
}
.yurara-activities-cta {
    padding: 80px 0;
    background: #98d8e8;
    color: white;
    text-align: center;
}

.yurara-activities-cta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-activities-cta h2 {
    font-size: 36px !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    color: white !important;
}

.yurara-activities-cta p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 40px;
    opacity: 0.95;
}

.yurara-activities-cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.yurara-activities-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-activities-btn-primary {
    background: #0066cc;
    color: #333;
    border-color: #0066cc;
}

.yurara-activities-btn-primary:hover {
    background: #FFE680;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #333;
}

.yurara-activities-btn-secondary {
    background: transparent;
    color: white;
    border-color: white;
}

.yurara-activities-btn-secondary:hover {
    background: white;
    color: #98d8e8;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

/* デスクトップ版での農園作業の配置（画像を右に） */
.yurara-farming-detail .yurara-activities-detail-text {
    order: 1; /* テキストを左に */
}

.yurara-farming-detail .yurara-activities-detail-image {
    order: 2; /* 画像を右に */
}

/* レスポンシブ対応 */
@media (max-width: 968px) {
    .yurara-activities-detail-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .yurara-activities-detail-text,
    .yurara-farming-detail .yurara-activities-detail-text {
        order: 1;
    }
    
    .yurara-activities-detail-image,
    .yurara-farming-detail .yurara-activities-detail-image {
        order: 2;
    }

.yurara-activities-wave {
    height: 156px; /* 波の高さに応じて調整 */
    background-image: url('https://kochi-ai.com/wp-content/uploads/wave-image-02-tab.png');
}	
}

@media (max-width: 768px) {
    .yurara-activities-title {
        font-size: 36px !important;
    }
    
    .yurara-activities-overview-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-activities-schedule-timeline::before {
        left: 60px;
    }
    
    .yurara-activities-schedule-time {
        width: 60px;
        font-size: 16px;
    }
    
    .yurara-activities-schedule-desc {
        margin-left: 30px;
    }
    
    .yurara-activities-info-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-activities-cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .yurara-activities-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
	.yurara-activities-wave {
    height: 156px; /* 波の高さに応じて調整 */
    background-image: url('https://kochi-ai.com/wp-content/uploads/wave-image-02-sp.png');
}
/* 768px以下での栽培作物のレスポンシブ対応 */
    /* より具体的なセレクタを使用 */
    .yurara-farming-crops .yurara-farming-crop-item {
        display: block;
        padding: 30px 20px;
        text-align: center;
    }
    
    .yurara-farming-crops .yurara-farming-crop-item:nth-child(odd),
    .yurara-farming-crops .yurara-farming-crop-item:nth-child(even) {
        display: block;
    }
    
    .yurara-farming-crops .yurara-farming-crop-image {
        display: block;
        width: 100%;
        max-width: 250px;
        margin: 0 auto 20px auto;
        order: unset;
    }
    
    .yurara-farming-crops .yurara-farming-crop-content {
        display: block;
        margin: 0;
        order: unset;
    }
	.yurara-activities-detail-text {
        margin: 0 20px;
    }
}

@media (max-width: 480px) {
    .yurara-activities-header {
        padding: 60px 0;
    }
    
    .yurara-activities-title {
        font-size: 28px !important;
    }
    
    .yurara-activities-overview,
    .yurara-activities-schedule,
    .yurara-activities-detail,
    .yurara-activities-info,
    .yurara-activities-cta {
        padding: 30px 0 30px 0;
    }
    
    .yurara-activities-schedule-title,
    .yurara-activities-info-title,
    .yurara-activities-cta h2 {
        font-size: 28px !important;
    }
    
    .yurara-activities-detail-title {
        font-size: 28px !important;
    }
}

/* WordPressテーマとの競合回避 */
.yurara-activities-header *,
.yurara-activities-overview *,
.yurara-activities-schedule *,
.yurara-activities-detail *,
.yurara-activities-info *,
.yurara-activities-cta * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-activities-overview-item h3,
.yurara-activities-detail-title,
.yurara-activities-detail-description h3,
.yurara-activities-detail-description h4,
.yurara-activities-schedule-title,
.yurara-activities-info-title,
.yurara-activities-info-item h3,
.yurara-activities-cta h2 {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-activities-overview-item p,
.yurara-activities-detail-description p,
.yurara-activities-detail-description li,
.yurara-activities-schedule-desc p,
.yurara-activities-info-item p,
.yurara-activities-cta p {
    font-family: inherit;
}

/* ===============================================
   農園作業拡充コンテンツ用CSS
   =============================================== */

/* 農園での具体的な作業内容 */
.yurara-farming-work-content {
    padding: 20px 0;
    background: #f8f9fa;
}

.yurara-farming-work-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-farming-work-title {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    color: #333;
    margin-bottom: 50px;
}

.yurara-farming-work-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
}

.yurara-farming-work-item {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden; /* 画像がはみ出ないように */
    transition: transform 0.3s ease;
}

.yurara-farming-work-item:hover {
    transform: translateY(-5px);
}

/* 画像エリア */
.yurara-farming-work-image {
    width: 100%;
    height: 200px;
    overflow: hidden;
    position: relative;
}

.yurara-farming-work-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.yurara-farming-work-item:hover .yurara-farming-work-image img {
    transform: scale(1.05);
}

/* コンテンツエリア */
.yurara-farming-work-content-area {
    padding: 30px;
    text-align: center;
}

/* アイコンは小さく調整または削除 */
.yurara-farming-work-icon {
    width: 60px;
    height: 60px;
    background: #4fb78a;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.yurara-farming-work-icon i {
    font-size: 24px;
    color: white;
}

.yurara-farming-work-item h4 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.yurara-farming-work-item p {
    color: #666;
    line-height: 1.7;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .yurara-farming-work-image {
        height: 180px;
    }
    
    .yurara-farming-work-content-area {
        padding: 20px;
    }
}

/* 栽培作物の詳細 */
.yurara-farming-crops {
	padding: 80px 0 0 0;
    background: white;
}

.yurara-farming-crops-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-farming-crops-title {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

.yurara-farming-crops-grid {
    display: grid;
    gap: 50px;
}
.yurara-farming-crop-item {
    display: grid;
    grid-template-columns: 300px 1fr; /* または auto auto */
    gap: 0px;
    justify-content: center; /* グリッドアイテム全体を中央寄せ */
    align-items: center;
    background: #f8f9fa;
    padding: 40px;
    border-radius: 15px;
}
/* 奇数（1番目・3番目）= ブルーベリー・いちじく を文章左、画像右に */
.yurara-farming-crop-item:nth-child(odd) {
    grid-template-columns: 1fr 300px;
}
.yurara-farming-crop-item:nth-child(odd) .yurara-farming-crop-image {
    order: 2;
}
.yurara-farming-crop-item:nth-child(odd) .yurara-farming-crop-content {
    order: 1;
}

/* 偶数（2番目・4番目）= さつまいも・キウイ を画像左、文章右に */
.yurara-farming-crop-item:nth-child(even) {
    grid-template-columns: 300px 1fr;
}
.yurara-farming-crop-item:nth-child(even) .yurara-farming-crop-image {
    order: 1;
}
.yurara-farming-crop-item:nth-child(even) .yurara-farming-crop-content {
    order: 2;
	margin: 0 0 0 20px;
}

.yurara-farming-crop-content h4 {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}

.yurara-farming-crop-content p {
    color: #666;
    line-height: 1.7;
    margin-bottom: 15px;
}

.yurara-farming-crop-content strong {
    color: #4fb78a;
    font-weight: 600;
}

/* 6次産業化への取り組み */
.yurara-farming-industry {
    padding: 80px 0;
    background: #4fb78a;
    color: white;
}

.yurara-farming-industry-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-farming-industry-title {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 50px;
    color: white;
}

.yurara-farming-industry-content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 60px;
    align-items: center;
}

.yurara-farming-industry-text p {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 30px;
}

.yurara-farming-industry-text h4 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
    margin-top: 30px;
}

.yurara-farming-industry-text ul {
    list-style: none;
    padding: 0;
}

.yurara-farming-industry-text li {
    padding: 8px 0;
    padding-left: 25px;
    position: relative;
}

.yurara-farming-industry-text li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #0066cc;
    font-weight: bold;
}

.yurara-farming-industry-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.industry-flow-step {
    width: 200px;
    height: 80px;
    background: white;
    color: #4fb78a;
    border-radius: 25px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.flow-number {
    width: 50px;
    height: 50px;
    background: #4fb78a;
    color: white;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;
    margin-right: 15px;
}

.flow-text {
    font-size: 18px;
    font-weight: 600;
}

.flow-arrow {
    font-size: 24px;
    color: white !important;
    font-weight: bold;
}

/* 農園作業で身につくスキル */
.yurara-farming-skills {
    padding: 80px 0;
    background: white;
}

.yurara-farming-skills-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-farming-skills-title {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

.yurara-farming-skills-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 40px;
}

.yurara-farming-skill-category {
    background: #f8f9fa;
    padding: 40px 30px;
    border-radius: 0 0 15px 15px;
    border-top: 5px solid #4fb78a;
}

.yurara-farming-skill-category h4 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.yurara-farming-skill-category i {
    color: #4fb78a;
    font-size: 24px;
}

.yurara-farming-skill-category ul {
    list-style: none;
    padding: 0;
}

.yurara-farming-skill-category li {
    padding: 8px 0;
    color: #666;
    padding-left: 20px;
    position: relative;
}

.yurara-farming-skill-category li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #4fb78a;
    font-weight: bold;
}

/* 地域への貢献 */
.yurara-farming-contribution {
    padding: 80px 0;
    background: #f8f9fa;
}

.yurara-farming-contribution-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-farming-contribution-title {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    color: #333;
    margin-bottom: 60px;
}

.yurara-farming-contribution-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
}

.yurara-farming-contribution-item {
    background: white;
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease;
}

.yurara-farming-contribution-image {
    width: 100%;
    height: 180px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 15px;
}

.yurara-farming-contribution-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.yurara-farming-contribution-item:hover .yurara-farming-contribution-image img {
    transform: scale(1.05);
}

.yurara-farming-contribution-icon {
    width: 80px;
    height: 80px;
    background: #0066cc;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
}

.yurara-farming-contribution-icon i {
    font-size: 36px;
    color: #fff;
}

.yurara-farming-contribution-item h4 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.yurara-farming-contribution-item p {
    color: #666;
    line-height: 1.7;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .yurara-farming-work-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-farming-crop-item {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .yurara-farming-crop-item:nth-child(even) {
        grid-template-columns: 1fr;
    }
    
    .yurara-farming-crop-item:nth-child(even) .yurara-farming-crop-image,
    .yurara-farming-crop-item:nth-child(even) .yurara-farming-crop-content {
        order: unset;
    }
    
    .yurara-farming-industry-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
 
	.yurara-farming-skills {
    padding: 80px 0 0 0;
}
	
    .yurara-farming-skills-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-farming-contribution-content {
        grid-template-columns: 1fr;
        gap: 30px;
    }
	.yurara-farming-industry {
    padding: 80px 0 0 0;
}
}

@media (max-width: 480px) {
    .yurara-farming-work-container,
    .yurara-farming-crops-container,
    .yurara-farming-industry-container,
    .yurara-farming-skills-container,
    .yurara-farming-contribution-container {
        padding: 0 15px;
    }
    
    .yurara-farming-work-title,
    .yurara-farming-crops-title,
    .yurara-farming-industry-title,
    .yurara-farming-skills-title,
    .yurara-farming-contribution-title {
        font-size: 24px;
    }
    
    .industry-flow-step {
        width: 100%;
        max-width: 250px;
    }
.yurara-farming-crops {
	padding: 40px 0 0 0;
}
.yurara-farming-contribution {
    padding: 40px 0 40px 0;
}
}
























/* ===============================================
   ゆら・らの支援内容ページ専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #72bae7(水色), #c84e3(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-support-header,
.yurara-support-plan,
.yurara-support-menu,
.yurara-support-daily,
.yurara-support-cooperation,
.yurara-support-cta {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* 基本設定 */
.yurara-support-header,
.yurara-support-plan,
.yurara-support-menu,
.yurara-support-daily,
.yurara-support-cooperation,
.yurara-support-cta {
    font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
    line-height: 1.6;
    color: #333;
}

/* ヘッダーセクション */
.yurara-support-header {
    background: linear-gradient(135deg, #4fb78a 0%, #3a9270 100%);
    color: white;
    padding: 80px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.yurara-support-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="2" fill="rgba(255,255,255,0.1)"/></svg>') repeat;
    background-size: 50px 50px;
}

.yurara-support-header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.yurara-support-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0066cc;
}

.yurara-support-title {
    font-size: 48px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    letter-spacing: 2px;
    color: white !important;
}

.yurara-support-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    max-width: 800px;
    margin: 0 auto;
}

/* 共通セクションタイトル */
.yurara-support-section-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 60px !important;
    color: #333 !important;
    position: relative;
}

.yurara-support-section-title::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    border-radius: 2px;
}

/* 個別支援計画セクション */
.yurara-support-plan {
    padding: 80px 0;
    background-color: white;
}

.yurara-support-plan-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-support-plan-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.yurara-support-plan-image img {
    width: 320px;
    border-radius: 16px;
}

.yurara-support-plan-text h3 {
    font-size: 28px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    color: #4fb78a !important;
}

.yurara-support-plan-text p {
    line-height: 1.7;
    color: #555;
    margin-bottom: 30px;
}

.yurara-support-plan-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.yurara-support-plan-feature {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 0px 12px 12px 0px;
    border-left: 4px solid #4fb78a;
}

.yurara-support-plan-feature-icon {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
}

.yurara-support-plan-feature-text h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 8px 0 !important;
    color: #333 !important;
}

.yurara-support-plan-feature-text p {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
    margin: 0;
}

/* 支援メニューセクション */
.yurara-support-menu {
    padding: 80px 0;
    background: #eaf7e4;
}

.yurara-support-menu-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-support-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.yurara-support-menu-item {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}


.yurara-life-support {
    border-color: none;
}

.yurara-work-support {
    border-color: none;
}

.yurara-social-support {
    border-color: none;
}

.yurara-health-support {
    border-color: none;
}

.yurara-support-menu-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    color: white;
    font-size: 32px;
}

.yurara-life-support .yurara-support-menu-icon {
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
}

.yurara-work-support .yurara-support-menu-icon {
    background: linear-gradient(135deg, #0066cc, #FFE680);
    color: #fff;
}

.yurara-social-support .yurara-support-menu-icon {
    background: linear-gradient(135deg, #4fb78a, #3a9270);
}

.yurara-health-support .yurara-support-menu-icon {
    background: linear-gradient(135deg, #0099cc, #d65a3e);
}

.yurara-support-menu-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 16px 0 !important;
    color: #333 !important;
    text-align: center;
}

.yurara-support-menu-description {
    line-height: 1.6;
    color: #666;
    margin-bottom: 20px;
    text-align: center;
}

.yurara-support-menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-support-menu-list li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
}

.yurara-support-menu-list li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #0066cc;
    font-size: 12px;
    top: 4px;
}

/* 1日の支援の流れセクション */
.yurara-support-daily {
    padding: 80px 0 40px 0;
    background-color: white;
}

.yurara-support-daily-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-support-daily-subtitle {
    font-size: 18px;
    text-align: center;
    color: #666;
    margin-bottom: 60px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.yurara-support-daily-timeline {
    position: relative;
}

.yurara-support-daily-timeline::before {
    content: '';
    position: absolute;
    left: 80px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, #4fb78a, #72bae7);
}

.yurara-support-daily-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 50px;
    position: relative;
}

.yurara-support-daily-time {
    flex-shrink: 0;
    width: 80px;
    font-size: 20px;
    font-weight: 700;
    color: #4fb78a;
    position: relative;
    z-index: 2;
}

.yurara-support-daily-time::after {
    content: '';
    position: absolute;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #4fb78a;
}

.yurara-support-daily-content {
    margin-left: 40px;
    background: #f8f9fa;
    padding: 30px;
    border-radius: 0 16px 16px 0;
    border-left: 4px solid #4fb78a;
    flex: 1;
}

.yurara-support-daily-content h4 {
    font-size: 20px !important;
    font-weight: 600 !important;
    margin: 0 0 12px 0 !important;
    color: #333 !important;
}

.yurara-support-daily-content p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 20px;
}

.yurara-support-daily-support {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.yurara-support-tag {
    display: inline-block;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

/* 相談支援との連携セクション */
.yurara-support-cooperation {
    padding: 80px 0;
    background: linear-gradient(135deg, #0066cc 0%, #FFE680 100%);
}

.yurara-support-cooperation-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-support-cooperation-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.yurara-support-cooperation-text h3 {
    font-size: 28px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    color: #333 !important;
}

.yurara-support-cooperation-text > p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 30px;
}

.yurara-support-cooperation-list {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.yurara-support-cooperation-item {
    background: rgba(255, 255, 255, 0.9);
    padding: 25px;
    border-radius: 12px;
    backdrop-filter: blur(10px);
}

.yurara-support-cooperation-item h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 12px 0 !important;
    color: #4fb78a !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.yurara-support-cooperation-item ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-support-cooperation-item li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 6px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-support-cooperation-item li::before {
    content: '・';
    position: absolute;
    left: 0;
    color: #4fb78a;
    font-weight: bold;
}

.yurara-support-cooperation-image img {
	width: 320px;
	border-radius: 16px;
}

/* CTAセクション */
.yurara-support-cta {
    padding: 40px 0 60px 0;
    background: linear-gradient(to bottom, #98d8e8, #5ba3d9);
    color: white;
    text-align: center;
}

.yurara-support-cta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-support-cta h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 20px;
    color: white;
}

.yurara-support-cta p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 40px;
    opacity: 0.95;
}

.yurara-support-cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.yurara-support-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-support-btn-primary {
    background: #0066cc;
    color: #333;
    border-color: #0066cc;
}

.yurara-support-btn-primary:hover {
    background: #FFE680;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #333;
}

.yurara-support-btn-secondary {
    background: transparent;
    color: white;
    border-color: white;
}

.yurara-support-btn-secondary:hover {
    background: white;
    color: #98d8e8;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

/* レスポンシブ対応 */
@media (max-width: 968px) {
    .yurara-support-plan-content,
    .yurara-support-cooperation-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .yurara-support-menu-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .yurara-support-title {
        font-size: 36px !important;
    }
    
    .yurara-support-section-title {
        font-size: 28px !important;
    }
    
    .yurara-support-daily-timeline::before {
        left: 60px;
    }
    
    .yurara-support-daily-time {
        width: 60px;
        font-size: 18px;
    }
    
    .yurara-support-daily-content {
        margin-left: 30px;
    }
    
    .yurara-support-cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .yurara-support-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
.yurara-support-cta h2 {
    font-size: 30px;
}
}

@media (max-width: 480px) {
    .yurara-support-header,
    .yurara-support-plan,
    .yurara-support-menu,
    .yurara-support-daily,
    .yurara-support-cooperation,
    .yurara-support-cta {
        padding: 60px 0;
    }
    
    .yurara-support-title {
        font-size: 28px !important;
    }
    
    .yurara-support-section-title {
        font-size: 24px !important;
    }

.yurara-support-plan {
    padding: 80px 0 0 0;
}
	
    .yurara-support-plan-features {
        gap: 15px;
    }
    
    .yurara-support-plan-feature {
        padding: 15px;
    }
    
    .yurara-support-menu-item {
        padding: 30px 20px;
    }
.yurara-support-cta h2 {
    font-size: 26px;
}
    .yurara-support-plan-content {
        margin-bottom: -40px;
    }	
}

/* WordPressテーマとの競合回避 */
.yurara-support-header *,
.yurara-support-plan *,
.yurara-support-menu *,
.yurara-support-daily *,
.yurara-support-cooperation *,
.yurara-support-cta * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-support-title,
.yurara-support-section-title,
.yurara-support-plan-text h3,
.yurara-support-menu-title,
.yurara-support-daily-content h4,
.yurara-support-cooperation-text h3,
.yurara-support-cooperation-item h4,
.yurara-support-cta h2 {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-support-subtitle,
.yurara-support-plan-text p,
.yurara-support-menu-description,
.yurara-support-menu-list li,
.yurara-support-daily-subtitle,
.yurara-support-daily-content p,
.yurara-support-cooperation-text > p,
.yurara-support-cooperation-item li,
.yurara-support-cta p {
    font-family: inherit;
}


























/* ===============================================
   ゆら・らの見学・利用の流れページ専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #72bae7(水色), #c84e3(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-flow-header,
.yurara-flow-visit,
.yurara-flow-process,
.yurara-flow-documents,
.yurara-flow-faq,
.yurara-flow-cta {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* 基本設定 */
.yurara-flow-header,
.yurara-flow-visit,
.yurara-flow-process,
.yurara-flow-documents,
.yurara-flow-faq,
.yurara-flow-cta {
    font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
    line-height: 1.6;
    color: #333;
}

/* ヘッダーセクション */
.yurara-flow-header {
    background: linear-gradient(135deg, #72bae7 0%, #5ba3d9 100%);
    color: white;
    padding: 80px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.yurara-flow-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="2" fill="rgba(255,255,255,0.1)"/></svg>') repeat;
    background-size: 50px 50px;
}

.yurara-flow-header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.yurara-flow-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0066cc;
}

.yurara-flow-title {
    font-size: 48px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    letter-spacing: 2px;
    color: white !important;
}

.yurara-flow-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    max-width: 800px;
    margin: 0 auto;
}

/* 共通セクションタイトル */
.yurara-flow-section-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 60px !important;
    color: #333 !important;
    position: relative;
}

.yurara-flow-section-title::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
    border-radius: 2px;
}

/* 見学についてセクション */
.yurara-flow-visit {
    padding: 80px 0 0px 0;
    background-color: white;
}

.yurara-flow-visit-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-flow-visit-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.yurara-flow-visit-text h3 {
    font-size: 28px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    color: #72bae7 !important;
}

.yurara-flow-visit-text > p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 30px;
}

.yurara-flow-visit-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
}

.yurara-flow-visit-feature {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 0 12px 12px 0;
    border-left: 4px solid #72bae7;
}

.yurara-flow-visit-feature-icon {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
}

.yurara-flow-visit-feature-text h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 8px 0 !important;
    color: #333 !important;
}

.yurara-flow-visit-feature-text p {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
    margin: 0;
}

.yurara-flow-visit-info {
    background: linear-gradient(135deg, rgba(114, 186, 231, 0.05) 0%, rgba(114, 186, 231, 0.1) 100%);
    padding: 25px;
    border-radius: 12px;
    border: 2px solid rgba(114, 186, 231, 0.2);
}

.yurara-flow-visit-info h4 {
    font-size: 20px !important;
    font-weight: 600 !important;
    margin: 0 0 15px 0 !important;
    color: #72bae7 !important;
}

.yurara-flow-visit-info ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-flow-visit-info li {
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-flow-visit-image img {
    width: 320px;
    border-radius: 16px;
}

/* 利用開始までの流れセクション */
.yurara-flow-process {
    padding: 60px 0 80px 0;
    background: linear-gradient(135deg, rgba(255, 221, 100, 0.05) 0%, rgba(255, 221, 100, 0.1) 100%);
}

.yurara-flow-process-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-flow-process-subtitle {
    font-size: 18px;
    text-align: center;
    color: #666;
    margin-bottom: 60px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.yurara-flow-steps {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.yurara-flow-step {
    background: white;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.yurara-flow-step:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.15);
}

.yurara-flow-step-header {
    background: linear-gradient(135deg, #0066cc, #FFE680);
    padding: 20px 30px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.yurara-flow-step-number {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    color: #333;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.yurara-flow-step-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #333 !important;
}

.yurara-flow-step-content {
    padding: 30px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 30px;
    align-items: center;
}

.yurara-flow-step-description p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 20px;
}

.yurara-flow-step-details h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 12px 0 !important;
    color: #4fb78a !important;
}

.yurara-flow-step-details ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-flow-step-details li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 6px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-flow-step-details li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #0066cc;
    font-size: 12px;
    top: 4px;
}

.yurara-flow-step-note {
    background: rgba(114, 186, 231, 0.05);
    padding: 15px;
    border-left: 3px solid #72bae7;
    margin-top: 15px;
}

.yurara-flow-step-note p {
    margin: 0;
    font-size: 14px;
    color: #555;
}

.yurara-flow-step-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 12px;
    min-width: 220px;
}

/* アイコンからイラスト画像に変更 */
.yurara-flow-step-visual img {
    width: 100px;
    height: 100px;
    object-fit: contain;
    margin-bottom: 8px;
}

/* 古いアイコンスタイルを削除またはコメントアウト */
/*
.yurara-flow-step-visual i {
    font-size: 32px;
    color: #72bae7;
    margin-bottom: 8px;
}
*/

.yurara-flow-step-visual span {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

/* 必要書類セクション */
.yurara-flow-documents {
    padding: 80px 0;
    background-color: white;
}

.yurara-flow-documents-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-flow-documents-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.yurara-flow-document-card {
    background: white;
    border-radius: 16px;
    padding: 30px;
    transition: all 0.3s ease;
    border: 2px solid #4fb78a;
    text-align: center;
}

.yurara-flow-document-card:hover {

}

.yurara-flow-document-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: white;
    font-size: 32px;
}

.yurara-flow-document-card h3 {
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 16px 0 !important;
    color: #333 !important;
}

.yurara-flow-document-card > p {
    font-size: 16px;
    line-height: 1.6;
    color: #666;
    margin-bottom: 20px;
}

.yurara-flow-document-note {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    text-align: left;
}

.yurara-flow-document-note p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #555;
}

/* FAQセクション */
.yurara-flow-faq {
    padding: 80px 0;
    background: linear-gradient(135deg, rgba(79, 183, 138, 0.05) 0%, rgba(79, 183, 138, 0.1) 100%);
}

.yurara-flow-faq-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-flow-faq-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.yurara-flow-faq-item {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.yurara-flow-faq-question {
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    color: white;
    padding: 20px 25px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.yurara-flow-faq-question:hover {

}

.yurara-flow-faq-question h3 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 !important;
    color: white !important;
    display: flex;
    align-items: center;
    gap: 12px;
}

.yurara-flow-faq-answer {
    padding: 25px;
    background: white;
}

.yurara-flow-faq-answer p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin: 0;
}

/* CTAセクション */
.yurara-flow-cta {
    padding: 30px 0 60px 0;
    background: linear-gradient(to bottom, #98d8e8, #5ba3d9);
    color: white;
    text-align: center;
}

.yurara-flow-cta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-flow-cta h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 20px;
    color: white;
}

.yurara-flow-cta > p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 40px;
    opacity: 0.95;
}

.yurara-flow-cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.yurara-flow-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-flow-btn-primary {
    background: #0066cc;
    color: #333;
    border-color: #0066cc;
}

.yurara-flow-btn-primary:hover {
    background: #FFE680;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #333;
}

.yurara-flow-btn-secondary {
    background: transparent;
    color: white;
    border-color: white;
}

.yurara-flow-btn-secondary:hover {
    background: white;
    color: #98d8e8;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

.yurara-flow-contact-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 16px;
    opacity: 0.9;
}

.yurara-flow-contact-info p {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* レスポンシブ対応 */
@media (max-width: 968px) {
    .yurara-flow-visit-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .yurara-flow-step-content {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .yurara-flow-step-visual {
        order: -1;
        margin: 0 auto;
    }
    
    .yurara-flow-documents-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }
}

@media (max-width: 768px) {
    .yurara-flow-title {
        font-size: 36px !important;
    }
    
    .yurara-flow-section-title {
        font-size: 28px !important;
    }
    
    .yurara-flow-step-header {
        padding: 15px 20px;
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    
    .yurara-flow-step-content {
        padding: 20px;
    }
    
    .yurara-flow-cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .yurara-flow-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
    
    .yurara-flow-contact-info {
        font-size: 14px;
    }
	.yurara-flow-documents {
        padding: 80px 0 40px 0;
}
.yurara-flow-cta h2 {
    font-size: 30px;
}	
}

@media (max-width: 480px) {
    .yurara-flow-header,
    .yurara-flow-visit,
    .yurara-flow-process,
    .yurara-flow-documents,
    .yurara-flow-faq,
    .yurara-flow-cta {
        padding: 60px 0;
    }
    
    .yurara-flow-title {
        font-size: 28px !important;
    }
    
    .yurara-flow-section-title {
        font-size: 24px !important;
    }
    
    .yurara-flow-visit-features {
        gap: 15px;
    }
    
    .yurara-flow-visit-feature {
        padding: 15px;
    }
    
    .yurara-flow-steps {
        gap: 30px;
    }
    
    .yurara-flow-step-header {
        padding: 15px;
    }
    
    .yurara-flow-step-content {
        padding: 20px 15px;
    }
.yurara-flow-cta h2 {
    font-size: 26px;
}
}

/* WordPressテーマとの競合回避 */
.yurara-flow-header *,
.yurara-flow-visit *,
.yurara-flow-process *,
.yurara-flow-documents *,
.yurara-flow-faq *,
.yurara-flow-cta * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-flow-title,
.yurara-flow-section-title,
.yurara-flow-visit-text h3,
.yurara-flow-step-title,
.yurara-flow-document-card h3,
.yurara-flow-faq-question h3,
.yurara-flow-cta h2 {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-flow-subtitle,
.yurara-flow-visit-text > p,
.yurara-flow-process-subtitle,
.yurara-flow-step-description p,
.yurara-flow-document-card > p,
.yurara-flow-faq-answer p,
.yurara-flow-cta > p {
    font-family: inherit;
}
























/* ===============================================
   ゆら・らのお問い合わせページ専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #72bae7(水色), #c84e3(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-contact-header,
.yurara-contact-methods,
.yurara-contact-form,
.yurara-contact-faq,
.yurara-contact-access,
.yurara-contact-cta {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* 基本設定 */
.yurara-contact-header,
.yurara-contact-methods,
.yurara-contact-form,
.yurara-contact-faq,
.yurara-contact-access,
.yurara-contact-cta {
    font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
    line-height: 1.6;
    color: #333;
}

/* ヘッダーセクション */
.yurara-contact-header {
    background: linear-gradient(135deg, #0066cc 0%, #FFE680 100%);
    color: #333;
    padding: 80px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.yurara-contact-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="2" fill="rgba(255,255,255,0.3)"/></svg>') repeat;
    background-size: 50px 50px;
}

.yurara-contact-header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.yurara-contact-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #4fb78a;
}

.yurara-contact-title {
    font-size: 48px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    letter-spacing: 2px;
    color: #333 !important;
}

.yurara-contact-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: #555;
    max-width: 800px;
    margin: 0 auto;
}

/* 共通セクションタイトル */
.yurara-contact-section-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 60px !important;
    color: #333 !important;
    position: relative;
}

.yurara-contact-section-title::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: linear-gradient(135deg, #0066cc, #FFE680);
    border-radius: 2px;
}

/* お問い合わせ方法セクション */
.yurara-contact-methods {
    padding: 80px 0;
    background-color: white;
}

.yurara-contact-methods-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-contact-methods-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.yurara-contact-method-card {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    text-align: center;
    border: 2px solid #4fb78a;
}

.yurara-contact-phone {
    border-color: #4fb78a;
}

.yurara-contact-phone:hover {
    background: rgba(79, 183, 138, 0.05);
}

.yurara-contact-email {
    border-color: #72bae7;
}

.yurara-contact-email:hover {
    background: rgba(114, 186, 231, 0.05);
}

.yurara-contact-method-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    color: white;
    font-size: 32px;
}

.yurara-contact-phone .yurara-contact-method-icon {
    background: linear-gradient(135deg, #4fb78a, #3a9270);
}

.yurara-contact-email .yurara-contact-method-icon {
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
}

.yurara-contact-method-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 16px 0 !important;
    color: #333 !important;
}

.yurara-contact-method-description {
    line-height: 1.6;
    color: #666;
    margin-bottom: 30px;
}

.yurara-contact-phone-info,
.yurara-contact-email-info {
    text-align: left;
    margin-bottom: 30px;
}

.yurara-contact-phone-number,
.yurara-contact-phone-hours,
.yurara-contact-email-address,
.yurara-contact-email-response {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
    font-size: 16px;
}

.yurara-contact-phone-number i,
.yurara-contact-phone-hours i,
.yurara-contact-email-address i,
.yurara-contact-email-response i {
    width: 20px;
    color: #4fb78a;
}

.yurara-contact-phone-number a,
.yurara-contact-email-address a {
    font-size: 20px;
    font-weight: 700;
    color: #4fb78a;
    text-decoration: none;
}

.yurara-contact-phone-number a:hover,
.yurara-contact-email-address a:hover {
    color: #3a9270;
    text-decoration: underline;
}

.yurara-contact-phone-note,
.yurara-contact-email-note {
    background: rgba(79, 183, 138, 0.05);
    padding: 15px;
    border-radius: 0 8px 8px 0;
    border-left: 3px solid #4fb78a;
    margin-top: 15px;
}

.yurara-contact-phone-note p,
.yurara-contact-email-note p {
    margin: 0;
    font-size: 14px;
    color: #555;
}

/* 共通ボタンスタイル */
.yurara-contact-btn-01 {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-contact-btn-phone {
    background: #4fb78a;
    color: white;
    border-color: #4fb78a;
}

.yurara-contact-btn-phone:hover {
    background: #3a9270;
    border-color: #3a9270;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

.yurara-contact-btn-email {
    background: #72bae7;
    color: white;
    border-color: #72bae7;
}

.yurara-contact-btn-email:hover {
    background: #5ba3d9;
    border-color: #5ba3d9;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

.yurara-contact-btn-primary {
    background: #0066cc;
    color: #333;
    border-color: #0066cc;
}

.yurara-contact-btn-primary:hover {
    background: #FFE680;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #333;
}

.yurara-contact-btn-secondary {
    background: transparent;
    color: white;
    border-color: white;
}

.yurara-contact-btn-secondary:hover {
    background: white;
    color: #98d8e8;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

/* お問い合わせフォームセクション */
.yurara-contact-form {
    padding: 80px 0;
    background: none;
}

.yurara-contact-form-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-contact-form-subtitle {
    font-size: 18px;
    text-align: center;
    color: #666;
    margin-bottom: 40px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.yurara-contact-form-wrapper {
    background: white;
    padding: 40px;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
}

.yurara-contact-form-fallback {
    text-align: center;
    padding: 40px;
    color: #666;
}

.yurara-contact-form-notes {
    background: white;
    padding: 30px;
    border-radius: 12px;
    border: 2px solid #72bae7;
}

.yurara-contact-form-notes h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 15px 0 !important;
    color: #72bae7 !important;
}

.yurara-contact-form-notes ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-contact-form-notes li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-contact-form-notes li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #72bae7;
    font-size: 12px;
    top: 4px;
}

/* Contact Form 7スタイリング */
.yurara-contact-form-wrapper .wpcf7-form {
    margin: 0;
}

.yurara-contact-form-wrapper .wpcf7-form-control {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    font-size: 16px;
    font-family: inherit;
    transition: border-color 0.3s ease;
}

.yurara-contact-form-wrapper .wpcf7-form-control:focus {
    border-color: #72bae7;
    outline: none;
    box-shadow: 0 0 0 3px rgba(114, 186, 231, 0.1);
}

.yurara-contact-form-wrapper .wpcf7-textarea {
    min-height: 120px;
    resize: vertical;
}

.yurara-contact-form-wrapper .wpcf7-submit {
    background: #72bae7;
    color: white;
    border: none;
    padding: 16px 32px;
    border-radius: 50px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 20px auto 0;
}

.yurara-contact-form-wrapper .wpcf7-submit:hover {
    background: #5ba3d9;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.yurara-contact-form-wrapper .wpcf7-submit::before {
    content: '\f1d8';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.yurara-contact-form-wrapper label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
}

.yurara-contact-form-wrapper .wpcf7-form p {
    margin-bottom: 20px;
}

/* よくあるお問い合わせセクション */
.yurara-contact-faq {
    padding: 80px 0;
    background-color: white;
}

.yurara-contact-faq-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-contact-faq-subtitle {
    font-size: 18px;
    text-align: center;
    color: #666;
    margin-bottom: 40px;
}

.yurara-contact-faq-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    gap: 30px;
}

.yurara-contact-faq-item {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.yurara-contact-faq-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.yurara-contact-faq-question {
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    color: white;
    padding: 20px 25px;
}

.yurara-contact-faq-question h3 {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 !important;
    color: white !important;
    display: flex;
    align-items: center;
    gap: 12px;
}

.yurara-contact-faq-answer {
    padding: 25px;
    background: white;
}

.yurara-contact-faq-answer p {
    font-size: 15px;
    line-height: 1.7;
    color: #555;
    margin: 0;
}

/* アクセス情報セクション */
.yurara-contact-access {
    padding: 80px 0;
    background: linear-gradient(135deg, rgba(79, 183, 138, 0.05) 0%, rgba(79, 183, 138, 0.1) 100%);
}

.yurara-contact-access-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-contact-access-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: flex-start;
}

.yurara-contact-access-info h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 30px 0 !important;
    color: #4fb78a !important;
}

.yurara-contact-access-details {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.yurara-contact-access-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.yurara-contact-access-item i {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: #4fb78a;
    font-size: 20px;
    margin-top: 2px;
}

.yurara-contact-access-item strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
}

.yurara-contact-access-item p {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin: 0;
}

.yurara-contact-access-item a {
    color: #4fb78a;
    text-decoration: none;
}

.yurara-contact-access-item a:hover {
    color: #3a9270;
    text-decoration: underline;
}

.yurara-contact-access-map {
    background: white;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    height: 400px;
}

.yurara-contact-map-placeholder {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    color: #666;
    text-align: center;
}

.yurara-contact-map-placeholder i {
    font-size: 48px;
    margin-bottom: 15px;
    color: #4fb78a;
}

.yurara-contact-map-placeholder p {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 8px 0;
}

.yurara-contact-map-placeholder small {
    font-size: 12px;
    color: #999;
}

/* CTAセクション */
.yurara-contact-cta {
    padding: 80px 0;
    background: #98d8e8;
    color: white;
    text-align: center;
}

.yurara-contact-cta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-contact-cta h2 {
    font-size: 36px !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    color: white !important;
}

.yurara-contact-cta > p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 40px;
    opacity: 0.95;
}

.yurara-contact-cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

/* レスポンシブ対応 */
@media (max-width: 968px) {
    .yurara-contact-methods-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-contact-faq-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    
    .yurara-contact-access-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

@media (max-width: 768px) {
    .yurara-contact-title {
        font-size: 36px !important;
    }
    
    .yurara-contact-section-title {
        font-size: 28px !important;
    }

	.yurara-contact-methods {
    padding: 80px 0 20px 0;
}
	
    .yurara-contact-method-card {
        padding: 30px 20px;
    }
	
	.yurara-contact-form {
    padding: 20px 0 80px 0;
    background: none;
}
    
    .yurara-contact-form-wrapper {
        padding: 30px 20px;
    }
    
    .yurara-contact-cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .yurara-contact-btn-01 {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .yurara-contact-header,
    .yurara-contact-methods,
    .yurara-contact-form,
    .yurara-contact-faq,
    .yurara-contact-access,
    .yurara-contact-cta {
        padding: 60px 0;
    }
    
    .yurara-contact-title {
        font-size: 28px !important;
    }
    
    .yurara-contact-section-title {
        font-size: 24px !important;
    }
	
		.yurara-contact-methods {
    padding: 80px 0 0 0;
}
    
    .yurara-contact-method-card {
        padding: 25px 15px;
    }

		.yurara-contact-form {
    padding: 0px 0 80px 0;
}
	
    .yurara-contact-form-wrapper {
        padding: 10px 15px 25px 15px;
    }
    
    .yurara-contact-access-item {
        padding: 15px;
    }
}

/* WordPressテーマとの競合回避 */
.yurara-contact-header *,
.yurara-contact-methods *,
.yurara-contact-form *,
.yurara-contact-faq *,
.yurara-contact-access *,
.yurara-contact-cta * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-contact-title,
.yurara-contact-section-title,
.yurara-contact-method-title,
.yurara-contact-access-info h3,
.yurara-contact-faq-question h3,
.yurara-contact-cta h2 {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-contact-subtitle,
.yurara-contact-method-description,
.yurara-contact-form-subtitle,
.yurara-contact-faq-subtitle,
.yurara-contact-faq-answer p,
.yurara-contact-cta > p {
    font-family: inherit;
}



















/* ===============================================
   ゆら・らのアクセスページ専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #72bae7(水色), #e74c3c(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-access-header,
.yurara-access-info,
.yurara-access-hours,
.yurara-access-method,
.yurara-access-map,
.yurara-access-notice,
.yurara-access-cta {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* 基本設定 */
.yurara-access-header,
.yurara-access-info,
.yurara-access-hours,
.yurara-access-method,
.yurara-access-map,
.yurara-access-notice,
.yurara-access-cta {
    font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
    line-height: 1.6;
    color: #333;
}

/* ヘッダーセクション */
.yurara-access-header {
    background: #4fb78a;
    color: white;
    padding: 80px 0;
    text-align: center;
    position: relative;
}

.yurara-access-header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.yurara-access-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0066cc;
    text-transform: uppercase;
}

.yurara-access-title {
    font-size: 48px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    letter-spacing: 2px;
    color: white !important;
}

.yurara-access-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    max-width: 800px;
    margin: 0 auto;
}

/* 共通セクションタイトル */
.yurara-access-section-title {
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 60px !important;
    color: #333 !important;
    position: relative;
}

.yurara-access-section-title::after {
    content: '';
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    border-radius: 2px;
}

/* 基本情報セクション */
.yurara-access-info {
    padding: 80px 0;
    background-color: white;
}

.yurara-access-info-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-access-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    gap: 40px;
}

.yurara-access-info-card {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    border: 2px solid #4fb78a;
    transition: all 0.3s ease;
}

.yurara-access-info-card-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 30px 0 !important;
    color: #4fb78a !important;
    text-align: center;
}

.yurara-access-info-details {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.yurara-access-info-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.yurara-access-info-item i {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: #4fb78a;
    font-size: 20px;
    margin-top: 2px;
}

.yurara-access-info-item strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
}

.yurara-access-info-item p {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin: 0;
}

.yurara-access-info-item a {
    color: #4fb78a;
    text-decoration: none;
    font-weight: 600;
}

.yurara-access-info-item a:hover {
    color: #3a9270;
    text-decoration: underline;
}

/* 営業時間セクション */
.yurara-access-hours {
    padding: 80px 0;
    background: linear-gradient(135deg, rgba(79, 183, 138, 0.05) 0%, rgba(79, 183, 138, 0.1) 100%);
}

.yurara-access-hours-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-access-hours-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
}

.yurara-access-hours-card {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.yurara-access-hours-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4fb78a, #3a9270);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: white;
    font-size: 32px;
}

.yurara-access-hours-card h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    color: #333 !important;
}

.yurara-access-hours-time {
    margin-bottom: 20px;
}

.yurara-access-hours-main {
    display: block;
    font-size: 28px;
    font-weight: 700;
    color: #4fb78a;
    margin-bottom: 5px;
}

.yurara-access-hours-sub {
    display: block;
    font-size: 14px;
    color: #999;
}

.yurara-access-hours-card p {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin: 0;
}

/* アクセス方法セクション */
.yurara-access-method {
    padding: 80px 0;
    background-color: white;
}

.yurara-access-method-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-access-method-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
}

.yurara-access-method-card {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    text-align: center;
}

.yurara-access-method-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #72bae7, #5ba3d9);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: white;
    font-size: 32px;
}

.yurara-access-method-card h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    color: #333 !important;
}

.yurara-access-method-content {
    text-align: left;
}

.yurara-access-method-content p {
    font-size: 16px;
    font-weight: 600;
    color: #72bae7;
    margin-bottom: 15px;
}

.yurara-access-method-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-access-method-content li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-access-method-content li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #72bae7;
    font-size: 12px;
    top: 4px;
}

/* 地図セクション */
.yurara-access-map {
    padding: 80px 0;
    background: linear-gradient(135deg, rgba(114, 186, 231, 0.05) 0%, rgba(114, 186, 231, 0.1) 100%);
}

.yurara-access-map-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-access-map-wrapper {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 60px;
    align-items: flex-start;
}

.yurara-access-map-embed {
    background: white;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    height: 400px;
}

.yurara-access-map-placeholder {
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    color: #666;
    text-align: center;
    padding: 40px;
}

.yurara-access-map-placeholder i {
    font-size: 48px;
    margin-bottom: 0px;
    color: #72bae7;
}

.yurara-access-map-placeholder h3 {
    font-size: 24px !important;
    font-weight: 600 !important;
    margin: 0 0 10px 0 !important;
    color: #333 !important;
}

.yurara-access-map-placeholder p {
    font-size: 16px;
    margin: 0 0 10px 0;
    color: #555;
}

.yurara-access-map-placeholder small {
    font-size: 12px;
    color: #999;
}

.yurara-access-map-info h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 30px 0 !important;
    color: #333 !important;
}

.yurara-access-map-directions {
    margin-bottom: 40px;
}

.yurara-access-direction-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 20px;
}

.yurara-access-direction-number {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #72bae7;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 16px;
}

.yurara-access-direction-item p {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin: 5px 0 0 0;
}

.yurara-access-map-notes {
    background: white;
    padding: 25px;
    border-radius: 12px;
    border: 2px solid #72bae7;
}

.yurara-access-map-notes h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 15px 0 !important;
    color: #72bae7 !important;
}

.yurara-access-map-notes ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-access-map-notes li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-access-map-notes li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #72bae7;
    font-size: 12px;
    top: 4px;
}

/* 注意事項セクション */
.yurara-access-notice {
    padding: 80px 0;
    background-color: white;
}

.yurara-access-notice-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-access-notice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.yurara-access-notice-card {
    background: white;
    border-radius: 16px;
    padding: 30px 25px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    text-align: center;
}

.yurara-access-notice-important {
    border: 2px solid #e74c3c;
    background: rgba(231, 76, 60, 0.02);
}

.yurara-access-notice-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #e74c3c;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: white;
    font-size: 24px;
}

.yurara-access-notice-card:not(.yurara-access-notice-important) .yurara-access-notice-icon {
    background: #4fb78a;
}

.yurara-access-notice-card h3 {
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 15px 0 !important;
    color: #333 !important;
}

.yurara-access-notice-card p {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 20px;
    text-align: left;
}

.yurara-access-notice-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.yurara-access-notice-card li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-access-notice-card li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #4fb78a;
    font-size: 12px;
    top: 4px;
}

.yurara-access-notice-contact {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

.yurara-access-notice-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    background: #e74c3c;
    color: white;
}

.yurara-access-notice-btn:hover {
    background: #c0392b;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

/* CTAセクション */
.yurara-access-cta {
    padding: 80px 0;
    background: #0066cc;
    color: #3D2914;
    text-align: center;
}

.yurara-access-cta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-access-cta h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #3D2914;
}

.yurara-access-cta > p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 40px;
    color: #3D2914;
}

.yurara-access-cta-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
	margin: 20px 0 0 0;
}

/* 共通ボタンスタイル */
.yurara-access-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-access-btn-primary {
    background: #e74c3c;
    color: white;
    border-color: #e74c3c;
}

.yurara-access-btn-primary:hover {
    background: #c0392b;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

.yurara-access-btn-secondary {
    background: white;
    color: #3D2914;
    border-color: #0066cc;
}

.yurara-access-btn-secondary:hover {
    background: #fff;
    color: #3D2914;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

/* レスポンシブ対応 */
@media (max-width: 968px) {
    .yurara-access-info-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-access-hours-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-access-method-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yurara-access-map-wrapper {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .yurara-access-notice-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }
}

@media (max-width: 768px) {
    .yurara-access-title {
        font-size: 36px !important;
    }
    
    .yurara-access-section-title {
        font-size: 28px !important;
    }
    
    .yurara-access-info-card,
    .yurara-access-hours-card,
    .yurara-access-method-card,
    .yurara-access-notice-card {
        padding: 30px 20px;
    }
    
    .yurara-access-cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .yurara-access-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
    
    .yurara-access-notice-contact {
        flex-direction: column;
        align-items: center;
    }
.yurara-access-cta h2 {
    font-size: 30px;
}	
}

@media (max-width: 480px) {
    .yurara-access-header,
    .yurara-access-info,
    .yurara-access-hours,
    .yurara-access-method,
    .yurara-access-map,
    .yurara-access-notice,
    .yurara-access-cta {
        padding: 60px 0;
    }
    
    .yurara-access-title {
        font-size: 28px !important;
    }
    
    .yurara-access-section-title {
        font-size: 24px !important;
    }
    
    .yurara-access-info-card,
    .yurara-access-hours-card,
    .yurara-access-method-card,
    .yurara-access-notice-card {
        padding: 25px 15px;
    }
.yurara-access-cta h2 {
    font-size: 26px;
}		
}

/* WordPressテーマとの競合回避 */
.yurara-access-header *,
.yurara-access-info *,
.yurara-access-hours *,
.yurara-access-method *,
.yurara-access-map *,
.yurara-access-notice *,
.yurara-access-cta * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-access-title,
.yurara-access-section-title,
.yurara-access-info-card-title,
.yurara-access-hours-card h3,
.yurara-access-method-card h3,
.yurara-access-notice-card h3,
.yurara-access-cta h2 {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-access-subtitle,
.yurara-access-info-item p,
.yurara-access-hours-card p,
.yurara-access-method-content li,
.yurara-access-notice-card p,
.yurara-access-cta > p {
    font-family: inherit;
}


















/* ===============================================
   ゆら・らのよくある質問ページ専用CSS
   カラーパレット: メイン#0066cc(黄色), サブ#4fb78a(緑), #72bae7(水色), #e74c3c(赤)
   =============================================== */

/* WordPressの既存マージンをリセット */
.yurara-faq-header,
.yurara-faq-content,
.yurara-faq-cta {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* 基本設定 */
.yurara-faq-header,
.yurara-faq-content,
.yurara-faq-cta {
    font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック', 'Yu Gothic', 'メイリオ', sans-serif;
    line-height: 1.6;
    color: #333;
}

/* ヘッダーセクション */
.yurara-faq-header {
    background: #0066cc;
    color: #3D2914;
    padding: 80px 0;
    text-align: center;
    position: relative;
}

.yurara-faq-header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.yurara-faq-label {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #e74c3c;
    text-transform: uppercase;
}

.yurara-faq-title {
    font-size: 48px !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    letter-spacing: 2px;
    color: #3D2914 !important;
}

.yurara-faq-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: #5D4037;
    max-width: 800px;
    margin: 0 auto;
}

/* コンテンツセクション */
.yurara-faq-content {
    padding: 80px 0;
    background-color: #f8f9fa;
}

.yurara-faq-content-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

/* タブナビゲーション */
.yurara-faq-tabs {
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    flex-wrap: wrap;
    gap: 10px;
    background: white;
    padding: 10px;
    border-radius: 50px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.yurara-faq-tab {
    background: transparent;
    border: none;
    padding: 12px 24px;
    border-radius: 25px;
    font-size: 16px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.yurara-faq-tab:hover {
    background: rgba(255, 221, 100, 0.1);
    color: #0066cc;
}

.yurara-faq-tab.active {
    background: #0066cc;
    color: #3D2914;
    box-shadow: 0 2px 8px rgba(255, 221, 100, 0.3);
}

/* カテゴリーセクション */
.yurara-faq-category {
    display: none !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
}

.yurara-faq-category.active {
    display: block !important;
    opacity: 1;
    visibility: visible;
}

.yurara-faq-category-title {
    font-size: 32px !important;
    font-weight: 700 !important;
    text-align: center;
    margin-bottom: 40px !important;
    color: #333 !important;
    position: relative;
}

.yurara-faq-category-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    height: 3px;
    background: linear-gradient(135deg, #0066cc, #FFE680);
    border-radius: 2px;
}

/* FAQ アイテム */
.yurara-faq-item {
    background: white;
    border-radius: 12px;
    margin-bottom: 15px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: all 0.3s ease;
}

.yurara-faq-item:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.yurara-faq-item.active {
    border: 2px solid #0066cc;
    box-shadow: 0 4px 16px rgba(255, 221, 100, 0.2);
}

/* FAQ 質問部分 */
.yurara-faq-question {
    width: 100%;
    background: none;
    border: none;
    padding: 25px 30px;
    text-align: left;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    transition: all 0.3s ease;
}

.yurara-faq-question:hover {
    background: rgba(255, 221, 100, 0.05);
}

.yurara-faq-question span {
    flex: 1;
    margin-right: 20px;
}

.yurara-faq-question i {
    color: #0066cc;
    font-size: 16px;
    transition: transform 0.3s ease;
}

/* FAQ 回答部分 */
.yurara-faq-answer {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.4s ease-out !important;
    background: rgba(255, 221, 100, 0.02);
}

.yurara-faq-item.active .yurara-faq-answer {
    max-height: 2000px !important;
}

.yurara-faq-answer > div,
.yurara-faq-answer > p,
.yurara-faq-answer > ul {
    padding: 0 30px 30px;
}

.yurara-faq-answer p {
    font-size: 16px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 15px;
}

.yurara-faq-answer ul {
    list-style: none;
    padding-left: 30px;
    margin: 15px 30px 0;
}

.yurara-faq-answer li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.6;
    color: #555;
}

.yurara-faq-answer li::before {
    content: '●';
    position: absolute;
    left: 0;
    color: #0066cc;
    font-size: 12px;
    top: 4px;
}

.yurara-faq-answer strong {
    color: #333;
    font-weight: 600;
}

/* ステップ表示（申込み手続き用） */
.yurara-faq-steps {
    margin: 20px 0;
}

.yurara-faq-step {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 25px;
    padding: 20px;
    background: white;
    border-radius: 12px;
    border: 2px solid #e9ecef;
    transition: all 0.3s ease;
}

.yurara-faq-step:hover {
    border-color: #0066cc;
    background: rgba(255, 221, 100, 0.02);
}

.yurara-faq-step-number {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #0066cc;
    color: #3D2914;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
}

.yurara-faq-step strong {
    display: block;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.yurara-faq-step p {
    font-size: 15px;
    line-height: 1.6;
    color: #555;
    margin: 0;
}

/* 作業タイプ表示 */
.yurara-faq-work-types {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

.yurara-faq-work-type {
    background: white;
    padding: 20px;
    border-radius: 12px;
    border: 2px solid #e9ecef;
    transition: all 0.3s ease;
}

.yurara-faq-work-type:hover {
    border-color: #4fb78a;
    background: rgba(79, 183, 138, 0.02);
}

.yurara-faq-work-type strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #4fb78a;
    margin-bottom: 12px;
}

.yurara-faq-work-type ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.yurara-faq-work-type li {
    position: relative;
    padding-left: 15px;
    margin-bottom: 6px;
    font-size: 14px;
    line-height: 1.5;
    color: #555;
}

.yurara-faq-work-type li::before {
    content: '・';
    position: absolute;
    left: 0;
    color: #4fb78a;
    font-weight: 600;
}

/* CTAセクション */
.yurara-faq-cta {
    padding: 80px 0;
    background: #0066cc;
    color: #3D2914;
    text-align: center;
}

.yurara-faq-cta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-faq-cta h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #3D2914;
}

.yurara-faq-cta > p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 40px;
    color: #3D2914;
}

.yurara-faq-cta-buttons {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
	margin: 20px 0 0 0;
}

/* 共通ボタンスタイル */
.yurara-faq-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 24px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    white-space: nowrap;
}

.yurara-faq-btn-primary {
    background: #e74c3c;
    color: white;
    border-color: #e74c3c;
}

.yurara-faq-btn-primary:hover {
    background: #c0392b;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

.yurara-faq-btn-secondary {
    background: white;
    color: #3D2914;
    border-color: #0066cc;
}

.yurara-faq-btn-secondary:hover {
    background: #fff;
    color: #3D2914;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

.yurara-faq-btn-tertiary {
    background: #4fb78a;
    color: white;
    border-color: #4fb78a;
}

.yurara-faq-btn-tertiary:hover {
    background: #3a9270;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: white;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .yurara-faq-title {
        font-size: 36px !important;
    }
    
    .yurara-faq-category-title {
        font-size: 24px !important;
    }
    
    .yurara-faq-tabs {
        flex-direction: column;
        align-items: center;
        padding: 25px 15px;
        border-radius: 15px;
		gap: 0px;
    }
    
    .yurara-faq-tab {
        width: 100%;
        max-width: 250px;
        text-align: center;
    }
    
    .yurara-faq-question {
        padding: 20px 20px;
        font-size: 16px;
    }
    
    .yurara-faq-answer > div,
    .yurara-faq-answer > p,
    .yurara-faq-answer > ul {
        padding: 0 20px 25px;
    }
    
    .yurara-faq-answer ul {
        margin: 15px 20px 0;
        padding-left: 20px;
    }
    
    .yurara-faq-work-types {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .yurara-faq-step {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
    
    .yurara-faq-cta-buttons {
        flex-direction: column;
        align-items: center;
		gap: 25px;
		margin: 40px 0 0 0;
    }
    
    .yurara-faq-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
.yurara-faq-content {
    padding: 20px 0 80px 0;
    background-color: #f8f9fa;
}
.yurara-faq-cta h2 {
    font-size: 30px;
}	
}

@media (max-width: 480px) {
    .yurara-faq-header,
    .yurara-faq-content,
    .yurara-faq-cta {
        padding: 60px 0;
    }
    
    .yurara-faq-title {
        font-size: 28px !important;
    }
    
    .yurara-faq-category-title {
        font-size: 22px !important;
    }
    
    .yurara-faq-question {
        padding: 18px 15px;
        font-size: 15px;
    }
    
    .yurara-faq-answer > div,
    .yurara-faq-answer > p,
    .yurara-faq-answer > ul {
        padding: 0 15px 20px;
    }
    
    .yurara-faq-step {
        padding: 15px;
    }
    
    .yurara-faq-work-type {
        padding: 15px;
    }
.yurara-faq-cta h2 {
    font-size: 26px;
}	
}

/* WordPressテーマとの競合回避 */
.yurara-faq-header *,
.yurara-faq-content *,
.yurara-faq-cta * {
    box-sizing: border-box;
}

/* 一部のテーマで必要な場合のリセット */
.yurara-faq-title,
.yurara-faq-category-title,
.yurara-faq-cta h2 {
    font-family: inherit;
    line-height: 1.3;
}

.yurara-faq-subtitle,
.yurara-faq-answer p,
.yurara-faq-cta > p {
    font-family: inherit;
}

/* アニメーション効果 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.yurara-faq-item {
    animation: fadeInUp 0.5s ease-out;
}

.yurara-faq-item:nth-child(2) { animation-delay: 0.1s; }
.yurara-faq-item:nth-child(3) { animation-delay: 0.2s; }
.yurara-faq-item:nth-child(4) { animation-delay: 0.3s; }
.yurara-faq-item:nth-child(5) { animation-delay: 0.4s; }



















































/* ===============================================
   Q&A開閉用最小限CSS（displayベースで確実動作版）
   =============================================== */

/* FAQ回答部分（初期状態は非表示） */
.yurara-faq-answer {
    display: none !important;
    padding: 20px 30px !important;
    background: rgba(255, 221, 100, 0.02) !important;
}

/* アクティブ時は表示（JavaScriptで制御） */
.yurara-faq-item.active .yurara-faq-answer {
    display: block !important;
}

/* FAQ質問部分のスタイル強化 */
.yurara-faq-question {
    width: 100% !important;
    background: none !important;
    border: none !important;
    padding: 25px 30px !important;
    text-align: left !important;
    cursor: pointer !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #333 !important;
    transition: all 0.3s ease !important;
}

.yurara-faq-question:hover {
    background: rgba(255, 221, 100, 0.05) !important;
}

.yurara-faq-question span {
    flex: 1 !important;
    margin-right: 20px !important;
}

.yurara-faq-question i {
    color: #0066cc !important;
    font-size: 16px !important;
    transition: transform 0.3s ease !important;
}

/* FAQ項目全体 */
.yurara-faq-item {
    background: white !important;
    border-radius: 12px !important;
    margin-bottom: 15px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
}

.yurara-faq-item:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
}

.yurara-faq-item.active {
    border: 2px solid #0066cc !important;
    box-shadow: 0 4px 16px rgba(255, 221, 100, 0.2) !important;
}

/* 回答内のコンテンツスタイル */
.yurara-faq-answer p {
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #555 !important;
    margin-bottom: 15px !important;
}

.yurara-faq-answer ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 15px 0 !important;
}

.yurara-faq-answer li {
    position: relative !important;
    padding-left: 20px !important;
    margin-bottom: 8px !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #555 !important;
}

.yurara-faq-answer li::before {
    content: '●' !important;
    position: absolute !important;
    left: 0 !important;
    color: #0066cc !important;
    font-size: 12px !important;
    top: 4px !important;
}

.yurara-faq-answer strong {
    color: #333 !important;
    font-weight: 600 !important;
}

/* ステップ表示 */
.yurara-faq-steps {
    margin: 20px 0 !important;
}

.yurara-faq-step {
    display: flex !important;
    align-items: flex-start !important;
    gap: 20px !important;
    margin-bottom: 25px !important;
    padding: 20px !important;
    background: white !important;
    border-radius: 12px !important;
    border: 2px solid #e9ecef !important;
}

.yurara-faq-step-number {
    flex-shrink: 0 !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #0066cc !important;
    color: #3D2914 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 18px !important;
}

/* 作業タイプ表示 */
.yurara-faq-work-types {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 20px !important;
    margin: 20px 0 !important;
}

.yurara-faq-work-type {
    background: white !important;
    padding: 20px !important;
    border-radius: 12px !important;
    border: 2px solid #e9ecef !important;
}

.yurara-faq-work-type strong {
    display: block !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #4fb78a !important;
    margin-bottom: 12px !important;
}

/* モバイル対応 */
@media (max-width: 768px) {
    .yurara-faq-question {
        padding: 20px 20px !important;
        font-size: 16px !important;
    }
    
    .yurara-faq-answer {
        padding: 15px 20px !important;
    }
    
    .yurara-faq-work-types {
        grid-template-columns: 1fr !important;
    }
}






















/* ===============================================
   サイドバーのデザイン
   =============================================== */
/* サイドメニュー */
.yurara-sidebar {
  width: 100%;
  margin-bottom: 30px;
}

.yurara-menu-box {
  background: #ffffff;
  padding: 30px 25px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* メニュータイトル */
.yurara-menu-title {
    color: #333333;
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 20px 0;
    letter-spacing: 0.5px;
    border-bottom: 2px solid #0099cc;
    padding-bottom: 8px;
}

/* メニューリスト */
.yurara-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.yurara-menu-list li {
  margin-bottom: 20px;
}

.yurara-menu-list li:last-child {
  margin-bottom: 0;
  border-bottom: none;
}

/* メニューリンク */
.yurara-menu-list a {
  display: block;
  color: #333333;
  text-decoration: none;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.5px;
  transition: color 0.2s ease;
  position: relative;
  padding-bottom: 2px;
}

.yurara-menu-list a:hover {
  color: #0099cc;
}

/* アンダーライン効果 */
.yurara-menu-list a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: #0099cc;
  transition: width 0.3s ease;
}

.yurara-menu-list a:hover::after {
  width: 100%;
}

/* 現在のページ */
.yurara-menu-list .current a {
  color: #0099cc;
  font-weight: 500;
}

.yurara-menu-list .current a::after {
  width: 100%;
}

/* お問い合わせボタン */
.yurara-menu-cta {
  margin-top: 35px;
  text-align: center;
}

.yurara-contact-btn {
  display: inline-block;
  background: #0099cc;
  color: white;
  text-decoration: none;
  padding: 12px 35px;
  border-radius: 25px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.5px;
  transition: all 0.3s ease;
  box-shadow: 0 2px 6px rgba(200, 78, 49, 0.2);
}

.yurara-contact-btn:hover {
  background: #b8442a;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(200, 78, 49, 0.3);
  color: white;
}

/* レスポンシブ */
@media (max-width: 768px) {
  .yurara-menu-box {
    padding: 20px 18px;
  }
  
  .yurara-menu-title {
    font-size: 16px;
    margin-bottom: 20px;
  }
  
  .yurara-menu-list li {
    margin-bottom: 18px;
  }
  
  .yurara-menu-list a {
    font-size: 15px;
  }
  
  .yurara-menu-cta {
    margin-top: 28px;
  }
  
  .yurara-contact-btn {
    padding: 10px 30px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .yurara-menu-box {
    padding: 15px;
  }
  
  .yurara-menu-title {
    font-size: 15px;
  }
  
  .yurara-menu-list a {
    font-size: 14px;
  }
}




















/* ===============================================
   サイドバーの最近の投稿
   =============================================== */
.yurara-widget-box {
    background: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}
.yurara-widget-title {
    color: #333333;
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 20px 0;
    letter-spacing: 0.5px;
    border-bottom: 2px solid #0099cc;
    padding-bottom: 8px;
}
.yurara-recent-posts {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.yurara-recent-post {
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 15px;
}
.yurara-recent-post:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.yurara-recent-post-link {
    display: flex;
    align-items: flex-start;
    text-decoration: none;
    color: #333;
    transition: all 0.2s ease;
}
.yurara-recent-post-link:hover {
    color: #0099cc;
}
.yurara-recent-post-thumbnail {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    margin-right: 12px;
    border-radius: 4px;
    overflow: hidden;
    background: #f5f5f5;
}
.yurara-recent-post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.yurara-no-image {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
    color: #999;
    font-size: 24px;
}
.yurara-recent-post-content {
    flex: 1;
    min-width: 0;
}
.yurara-recent-post-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0 0 5px 0;
    color: inherit;
}
.yurara-recent-post-date {
    font-size: 12px;
    color: #999;
    font-weight: normal;
}




















/* パンくずリスト - 適切なセレクタで上書き */
#breadcrumb {
    background: #ffffff;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 14px;
    display: inline-table;
    width: auto;
    border-spacing: 0;
}

#breadcrumb div[style*="table-cell"] {
    display: table-cell;
    vertical-align: middle;
    white-space: nowrap;
}

#breadcrumb a {
    color: #0099cc;
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
}

#breadcrumb a:hover {
    background: rgba(200, 78, 49, 0.1);
    color: #0099cc;
}

/* FontAwesome アイコン */
#breadcrumb a[href*="/"]:first-child span::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f015";
    margin-right: 6px;
}

#breadcrumb div[style*="table-cell"]:not(:last-child)::after {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f054";
    color: #6c757d;
    font-size: 10px;
    margin: 0 8px;
}

/* 元の区切り文字を隠す */
#breadcrumb div[style*="table-cell"] {
    font-size: 0;
}

#breadcrumb div[style*="table-cell"] a,
#breadcrumb div[style*="table-cell"] span {
    font-size: 14px;
}

/* 現在の活動報告アイコンを変更 */
#breadcrumb a[href*="activity"] span::before,
#breadcrumb a[href*="katudo"] span::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f4d8" !important; /* file-text-o */
    margin-right: 6px;
}































/* ===============================================
   フルワイズ画像ギャラリー - 正しいアプローチ
   =============================================== */

/* WordPressの一般的な親要素制限を解除 */
.yurara-nofuku-gallery-section {
    padding: 60px 0 30px 0;
    background: #fff8eb;
    min-height: 100vh;
    
    /* 親要素の制限を抜け出す */
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

/* ギャラリーコンテナ */
.yurara-nofuku-gallery-container {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* ヘッダーエリア - 中央配置 */
.yurara-nofuku-gallery-header {
    text-align: center;
    margin-bottom: 20px;
    padding: 0 20px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* タイトル装飾 */
.yurara-nofuku-title-container {
    font-size: 48px;
    font-weight: 700;
    margin: 20px 0 20px 0;
    letter-spacing: 2px;
    color: #333;
}

.yurara-nofuku-title-container h2 {
    font-size: 1.8rem;
    font-weight: bold;
    color: #333;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

/* ドット装飾 */
.yurara-nofuku-dots-left,
.yurara-nofuku-dots-right {
    display: flex;
    gap: 12px;
    align-items: center;
}

.yurara-nofuku-dot {
    width: 8px;
    height: 8px;
    background: #0066cc;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 2px 4px rgba(255, 255, 255, 0.3);
}

.yurara-nofuku-title-text {
    font-size: 36px;
    font-weight: 700;
    color: #333;
    white-space: nowrap;
}

.yurara-gallery-subtitle {
    font-size: 18px;
    color: #666;
    line-height: 1.6;
    max-width: 600px;
    margin: 0 auto;
    font-weight: 300;
}

/* メインコンテンツ */
.yurara-nofuku-gallery-content {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
    margin: 0;
}

/* 画像ギャラリー - 完全フルワイズ */
.yurara-nofuku-image-gallery {
    order: 1;
    width: 100%;
    display: block;
    margin: 0;
}

.yurara-gallery-row {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    flex-wrap: nowrap;
    padding: 0;
    margin: 0;
}

/* 画像アイテム - シンプルなサイズ設定 */
.yurara-gallery-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.4s ease;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
    flex: 1;
    max-width: 160px;
    min-width: 80px;
    aspect-ratio: 1/1;
}

/* サイズクラスの統一 */
.yurara-gallery-item.yurara-large,
.yurara-gallery-item.yurara-medium,
.yurara-gallery-item.yurara-small {
    flex: 1;
    max-width: 250px;
    min-width: 180px;
    aspect-ratio: 1/1;
}

/* 画像スタイル */
.yurara-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.yurara-gallery-item:hover {

}

.yurara-gallery-item:hover img {

}

/* オーバーレイ */
.yurara-gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
    padding: 40px 20px 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.yurara-gallery-item:hover .yurara-gallery-overlay {
    opacity: 1;
}

.yurara-gallery-label {
    color: white;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    display: block;
}

/* テキストエリア */
.yurara-nofuku-gallery-text {
    order: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.yurara-gallery-text-content {
    max-width: 100%;
}

.yurara-gallery-section-title {
    font-size: 32px;
    font-weight: 800;
    color: #333;
    margin-bottom: 30px;
    letter-spacing: 1px;
    line-height: 1.4;
    text-align: center;
}

/* 説明文と特徴を横並び */
.yurara-gallery-content-wrapper {
    display: flex;
    gap: 40px;
    align-items: flex-start;
    margin-bottom: 30px;
}

.yurara-gallery-description {
    flex: 1;
    margin-bottom: 0;
}

.yurara-gallery-description p {
    font-size: 16px;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
    font-weight: 300;
}

.yurara-gallery-features-wrapper {
    flex: 1;
}

.yurara-gallery-features {
    margin-bottom: 0;
}

.yurara-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 30px;
    transition: transform 0.3s ease;
}

.yurara-feature-item:hover {

}

.yurara-feature-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #4fb78a, #72bae7);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 15px rgba(79, 183, 138, 0.3);
}

.yurara-feature-icon i {
    font-size: 20px;
    color: white;
}

.yurara-feature-text h4 {
    font-size: 18px;
    font-weight: 500;
    color: #333;
    margin: 0 0 8px 0;
}

.yurara-feature-text p {
    font-size: 14px;
    color: #666;
    margin: 0;
    line-height: 1.5;
}

/* ボタン */
.yurara-gallery-button-inline {
    margin-top: 20px;
}

.yurara-gallery-btn {
    display: inline-block;
    padding: 18px 36px;
    background: linear-gradient(135deg, #0066cc, #FFE77A);
    color: #333;
    text-decoration: none;
    border-radius: 50px;
    font-weight: 500;
    font-weight: 600;
    transition: all 0.4s ease;
    box-shadow: 0 8px 25px rgba(255, 221, 100, 0.3);
    border: none;
}

.yurara-gallery-btn:hover {
    background: linear-gradient(135deg, #FFE77A, #FFEB8A);
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(255, 221, 100, 0.4);
    color: #333;
    text-decoration: none;
}

/* WordPressの自動p要素を無効化 */
.yurara-nofuku-gallery-section p:empty,
.yurara-nofuku-gallery-content p:empty,
.yurara-nofuku-image-gallery p:empty {
    margin: 0;
    padding: 0;
    display: none;
}

/* 説明文と特徴を横並び - 左右逆転 */
.yurara-gallery-content-wrapper {
    display: flex;
    gap: 40px;
    align-items: flex-start;
    margin-bottom: 30px;
    flex-direction: row-reverse; /* 左右を逆にする */
}

/* レスポンシブ対応 */
@media (max-width: 1024px) {
    .yurara-nofuku-gallery-container {
        padding: 0 20px;
    }
    
    .yurara-nofuku-gallery-content {
        gap: 40px;
    }
    
    .yurara-gallery-content-wrapper {
        flex-direction: column;
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .yurara-nofuku-gallery-section {
        padding: 40px 0;
    }
    
    .yurara-nofuku-title-text {
        font-size: 28px;
    }
    
    .yurara-gallery-row {
        flex-wrap: wrap;
        gap: 10px;
        justify-content: center;
    }
    
    .yurara-gallery-item {
        min-width: 100px;
        max-width: 120px;
    }
    
    .yurara-gallery-section-title {
        font-size: 24px;
    }
	
    .yurara-gallery-content-wrapper {
        flex-direction: column-reverse; /* スマホでは逆順の縦積み */
        gap: 30px;
    }
}


















/* メインセクション */
.yurara-thank-you-section {
    padding: 80px 0;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

.yurara-thank-you-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

/* メインメッセージエリア */
.yurara-thank-you-main {
    text-align: center;
    margin-bottom: 60px;
}

.yurara-thank-you-icon {
    font-size: 80px;
    color: #4fb78a;
    margin-bottom: 30px;
    animation: checkBounce 1.5s ease-out;
}

@keyframes checkBounce {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.2); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}

/* タイトル装飾 */
.yurara-thank-you-title-container {
    margin-bottom: 30px;
}

.yurara-thank-you-title {
    font-size: 2rem;
    font-weight: bold;
    color: #333;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.yurara-thank-you-dots-left,
.yurara-thank-you-dots-right {
    display: flex;
    gap: 8px;
    align-items: center;
}

.yurara-thank-you-dot {
    width: 12px;
    height: 12px;
    background: #ffffff;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 2px 4px rgba(255, 255, 255, 0.3);
    animation: dotPulse 2s infinite ease-in-out;
}

.yurara-thank-you-dot:nth-child(2) {
    animation-delay: 0.3s;
}

.yurara-thank-you-dot:nth-child(3) {
    animation-delay: 0.6s;
}

@keyframes dotPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.3); opacity: 0.7; }
}

.yurara-thank-you-title-text {
    font-size: 32px;
    font-weight: 700;
    color: #333;
    white-space: nowrap;
}

.yurara-thank-you-subtitle {
    font-size: 20px;
    color: #555;
    margin-bottom: 30px;
    font-weight: 300;
}

.yurara-thank-you-message {
    background: rgba(255, 255, 255, 0.9);
    padding: 30px;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    max-width: 600px;
    margin: 0 auto;
}

.yurara-thank-you-message p {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 15px;
    color: #555;
}

.yurara-thank-you-message p:last-child {
    margin-bottom: 0;
}

.yurara-thank-you-message strong {
    color: #4fb78a;
    font-weight: 600;
}

/* 連絡先エリア */
.yurara-thank-you-contact {
    margin-bottom: 60px;
}

.yurara-thank-you-contact-title {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    color: #333;
    margin-bottom: 40px;
    position: relative;
}

.yurara-thank-you-contact-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background: linear-gradient(135deg, #4fb78a, #72bae7);
    border-radius: 2px;
}

.yurara-thank-you-contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.yurara-thank-you-contact-item {
    background: rgba(255, 255, 255, 0.95);
    padding: 30px;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
    transition: all 0.3s ease;
}

.yurara-thank-you-contact-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
}

.yurara-thank-you-contact-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #4fb78a, #72bae7);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.yurara-thank-you-contact-icon i {
    font-size: 24px;
    color: white;
}

.yurara-thank-you-contact-info h3 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.yurara-thank-you-phone,
.yurara-thank-you-email {
    font-size: 20px;
    font-weight: 700;
    color: #4fb78a;
    margin-bottom: 5px;
}

.yurara-thank-you-hours {
    font-size: 14px;
    color: #666;
}

/* お役立ち情報エリア */
.yurara-thank-you-info {
    margin-bottom: 60px;
}

.yurara-thank-you-info-title {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    color: #333;
    margin-bottom: 40px;
    position: relative;
}

.yurara-thank-you-info-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background: linear-gradient(135deg, #0066cc, #FFE77A);
    border-radius: 2px;
}

.yurara-thank-you-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
}

.yurara-thank-you-info-item {
    background: rgba(255, 255, 255, 0.9);
    padding: 30px;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    text-align: center;
    transition: all 0.3s ease;
}

.yurara-thank-you-info-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
}

.yurara-thank-you-info-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #72bae7, #4fb78a);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.yurara-thank-you-info-icon i {
    font-size: 20px;
    color: white;
}

.yurara-thank-you-info-item h3 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.yurara-thank-you-info-item p {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
    line-height: 1.6;
}

.yurara-thank-you-link {
    display: inline-block;
    padding: 10px 20px;
    background: linear-gradient(135deg, #4fb78a, #72bae7);
    color: white;
    text-decoration: none;
    border-radius: 25px;
    font-weight: 500;
    font-size: 14px;
    transition: all 0.3s ease;
}

.yurara-thank-you-link:hover {
    background: linear-gradient(135deg, #72bae7, #4fb78a);
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(79, 183, 138, 0.3);
    text-decoration: none;
    color: white;
}

/* アクションエリア */
.yurara-thank-you-actions {
    text-align: center;
    margin-bottom: 40px;
}

.yurara-thank-you-actions-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.yurara-thank-you-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 18px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.yurara-thank-you-btn-primary {
    background: linear-gradient(135deg, #0066cc, #FFE77A);
    color: #333;
    border-color: #0066cc;
}

.yurara-thank-you-btn-primary:hover {
    background: linear-gradient(135deg, #FFE77A, #FFEB8A);
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(255, 221, 100, 0.4);
    text-decoration: none;
    color: #333;
}

.yurara-thank-you-btn-secondary {
    background: transparent;
    color: #4fb78a;
    border-color: #4fb78a;
}

.yurara-thank-you-btn-secondary:hover {
    background: #4fb78a;
    color: white;
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(79, 183, 138, 0.3);
    text-decoration: none;
}

.yurara-thank-you-note {
    background: rgba(255, 255, 255, 0.8);
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
}

.yurara-thank-you-note p {
    font-size: 14px;
    color: #666;
    margin: 0;
    line-height: 1.6;
}

.yurara-thank-you-note i {
    color: #72bae7;
    margin-right: 8px;
}

/* 所在地 */
.yurara-thank-you-location {
    background: rgba(255, 255, 255, 0.9);
    padding: 30px;
    border-radius: 16px;
    text-align: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.yurara-thank-you-location h3 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.yurara-thank-you-location h3 i {
    color: #4fb78a;
    margin-right: 10px;
}

.yurara-thank-you-location address {
    font-style: normal;
    font-size: 16px;
    line-height: 1.8;
    color: #555;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .yurara-thank-you-section {
        padding: 40px 0;
    }
    
    .yurara-thank-you-icon {
        font-size: 60px;
    }
    
    .yurara-thank-you-title {
        flex-direction: column;
        gap: 15px;
    }
    
    .yurara-thank-you-title-text {
        font-size: 24px;
    }
    
    .yurara-thank-you-subtitle {
        font-size: 18px;
    }
    
    .yurara-thank-you-contact-title,
    .yurara-thank-you-info-title {
        font-size: 24px;
    }
    
    .yurara-thank-you-contact-item {
        flex-direction: column;
        text-align: center;
    }
    
    .yurara-thank-you-actions-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .yurara-thank-you-btn {
        width: 100%;
        max-width: 300px;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .yurara-thank-you-container {
        padding: 0 15px;
    }
    
    .yurara-thank-you-title {
        gap: 10px;
    }
    
    .yurara-thank-you-title-text {
        font-size: 20px;
    }
    
    .yurara-thank-you-message {
        padding: 20px;
    }
    
    .yurara-thank-you-contact-item,
    .yurara-thank-you-info-item,
    .yurara-thank-you-location {
        padding: 20px;
    }
}


















/* ===============================================
   プライバシーポリシーページ - シンプルデザイン
   =============================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Meiryo', sans-serif;
    line-height: 1.8;
    color: #333;
    background: #ffffff;
}

/* メインセクション */
.yurara-privacy-section {
    padding: 60px 0;
    min-height: 100vh;
}

.yurara-privacy-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ヘッダー */
.yurara-privacy-header {
    text-align: center;
    margin-bottom: 60px;
    padding-bottom: 40px;
    border-bottom: 2px solid #0066cc;
}

.yurara-privacy-title {
    font-size: 36px;
    font-weight: 700;
    color: #333;
    margin-bottom: 15px;
}

.yurara-privacy-updated {
    font-size: 14px;
    color: #666;
    text-align: right;
    margin-top: 20px;
}

/* 前文 */
.yurara-privacy-intro {
    background: #f8f9fa;
    padding: 30px;
    border-radius: 8px;
    margin-bottom: 50px;
    border-left: 4px solid #0066cc;
}

.yurara-privacy-intro p {
    font-size: 16px;
    margin: 0;
    color: #444;
    line-height: 1.8;
}

/* 本文コンテンツ */
.yurara-privacy-content {
    margin-bottom: 50px;
}

.yurara-privacy-item {
    margin-bottom: 50px;
}

.yurara-privacy-item h2 {
    font-size: 22px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.yurara-privacy-item h3 {
    font-size: 18px;
    font-weight: 600;
    color: #444;
    margin-bottom: 15px;
    margin-top: 30px;
}

.yurara-privacy-item p {
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 15px;
    color: #555;
}

.yurara-privacy-item p:last-child {
    margin-bottom: 0;
}

/* リスト */
.yurara-privacy-item ul {
    margin: 20px 0;
    padding-left: 25px;
}

.yurara-privacy-item li {
    font-size: 15px;
    line-height: 1.7;
    margin-bottom: 8px;
    color: #555;
}

/* リンク */
.yurara-privacy-item a {
    color: #4fb78a;
    text-decoration: underline;
    transition: color 0.3s ease;
}

.yurara-privacy-item a:hover {
    color: #72bae7;
    text-decoration: none;
}

/* フッター */
.yurara-privacy-footer {
    text-align: center;
    padding-top: 40px;
    border-top: 1px solid #e0e0e0;
}

.yurara-privacy-back-link {
    display: inline-block;
    padding: 12px 25px;
    background: #0066cc;
    color: #333;
    text-decoration: none;
    border-radius: 25px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.yurara-privacy-back-link:hover {
    background: #FFE77A;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 221, 100, 0.3);
    text-decoration: none;
    color: #333;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .yurara-privacy-section {
        padding: 40px 0;
    }
    
    .yurara-privacy-container {
        padding: 0 15px;
    }
    
    .yurara-privacy-title {
        font-size: 28px;
    }
    
    .yurara-privacy-intro {
        padding: 20px;
    }
    
    .yurara-privacy-intro p {
        font-size: 15px;
    }
    
    .yurara-privacy-item h2 {
        font-size: 20px;
    }
    
    .yurara-privacy-item h3 {
        font-size: 17px;
    }
    
    .yurara-privacy-item p,
    .yurara-privacy-item li {
        font-size: 14px;
    }
    
    .yurara-privacy-item ul {
        padding-left: 20px;
    }
}

@media (max-width: 480px) {
    .yurara-privacy-header {
        margin-bottom: 40px;
    }
    
    .yurara-privacy-title {
        font-size: 24px;
    }
    
    .yurara-privacy-intro {
        padding: 15px;
    }
    
    .yurara-privacy-item {
        margin-bottom: 40px;
    }
}
/* ================================================== */
/* 高知AI 専用スタイル */
/* ================================================== */

/* ページヘッダー */
.kochi-ai-page-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 80px 20px;
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
}

.kochi-ai-page-header-container {
    max-width: 800px;
    margin: 0 auto;
}

.kochi-ai-page-label {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 14px;
    letter-spacing: 2px;
    margin-bottom: 20px;
}

.kochi-ai-page-title {
    font-size: 36px;
    margin: 20px 0;
    font-weight: bold;
}

.kochi-ai-page-subtitle {
    font-size: 16px;
    opacity: 0.9;
    line-height: 1.8;
}

/* セクションタイトル */
.kochi-ai-section-title {
    font-size: 28px;
    text-align: center;
    margin: 50px 0 30px;
    color: #333;
    position: relative;
    padding-bottom: 15px;
}

.kochi-ai-section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #667eea, #764ba2);
}

/* ソリューションページ */
.kochi-ai-solutions {
    padding: 40px 20px;
    max-width: 1000px;
    margin: 0 auto;
}

.kochi-ai-solutions-container {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.kochi-ai-solution-item {
    display: flex;
    gap: 30px;
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
    align-items: flex-start;
}

.kochi-ai-solution-icon {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kochi-ai-solution-icon i {
    font-size: 32px;
    color: #fff;
}

.kochi-ai-solution-content h3 {
    font-size: 22px;
    color: #333;
    margin-bottom: 15px;
}

.kochi-ai-solution-content p {
    color: #666;
    line-height: 1.8;
    margin-bottom: 15px;
}

.kochi-ai-solution-content ul {
    list-style: none;
    padding: 0;
}

.kochi-ai-solution-content ul li {
    padding: 8px 0;
    padding-left: 25px;
    position: relative;
    color: #555;
}

.kochi-ai-solution-content ul li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: #667eea;
    font-weight: bold;
}

/* プロセス・フロー */
.kochi-ai-process {
    background: #f8f9fa;
    padding: 60px 20px;
    margin: 40px 0;
}

.kochi-ai-process-container {
    max-width: 1000px;
    margin: 0 auto;
}

.kochi-ai-process-steps {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.kochi-ai-process-step {
    flex: 1;
    min-width: 200px;
    text-align: center;
    padding: 30px 20px;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
}

.kochi-ai-step-number {
    font-size: 36px;
    font-weight: bold;
    color: #667eea;
    margin-bottom: 15px;
}

.kochi-ai-process-step h4 {
    font-size: 18px;
    color: #333;
    margin-bottom: 10px;
}

.kochi-ai-process-step p {
    color: #666;
    font-size: 14px;
}

/* 導入事例ページ */
.kochi-ai-cases {
    padding: 40px 20px;
    max-width: 1000px;
    margin: 0 auto;
}

.kochi-ai-cases-container {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.kochi-ai-case-item {
    display: flex;
    gap: 30px;
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.kochi-ai-case-image {
    flex: 0 0 300px;
}

.kochi-ai-case-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kochi-ai-case-content {
    flex: 1;
    padding: 30px;
}

.kochi-ai-case-category {
    display: inline-block;
    background: #667eea;
    color: #fff;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 12px;
    margin-bottom: 15px;
}

.kochi-ai-case-title {
    font-size: 24px;
    color: #333;
    margin-bottom: 15px;
}

.kochi-ai-case-description {
    color: #666;
    line-height: 1.8;
    margin-bottom: 20px;
}

.kochi-ai-case-results {
    display: flex;
    gap: 30px;
}

.kochi-ai-case-result {
    text-align: center;
}

.kochi-ai-result-number {
    display: block;
    font-size: 36px;
    font-weight: bold;
    color: #667eea;
}

.kochi-ai-result-label {
    font-size: 14px;
    color: #666;
}

/* 会社概要ページ */
.kochi-ai-company-info {
    padding: 40px 20px;
    max-width: 900px;
    margin: 0 auto;
}

.kochi-ai-company-container {
    background: #fff;
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.kochi-ai-company-table table {
    width: 100%;
    border-collapse: collapse;
}

.kochi-ai-company-table th,
.kochi-ai-company-table td {
    padding: 20px;
    border-bottom: 1px solid #eee;
    text-align: left;
}

.kochi-ai-company-table th {
    width: 30%;
    background: #f8f9fa;
    font-weight: bold;
    color: #333;
}

.kochi-ai-company-table td {
    color: #555;
}

.kochi-ai-company-table ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.kochi-ai-company-table ul li {
    padding: 5px 0;
}

/* アクセスセクション */
.kochi-ai-access {
    padding: 40px 20px;
    background: #f8f9fa;
}

.kochi-ai-access-container {
    max-width: 1000px;
    margin: 0 auto;
}

.kochi-ai-access-content {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

.kochi-ai-access-map {
    flex: 1;
    min-width: 300px;
}

.kochi-ai-access-map iframe {
    border-radius: 15px;
}

.kochi-ai-access-info {
    flex: 1;
    min-width: 300px;
    background: #fff;
    padding: 30px;
    border-radius: 15px;
}

.kochi-ai-access-info h3 {
    font-size: 20px;
    margin-bottom: 20px;
    color: #333;
}

.kochi-ai-access-info ul {
    list-style: none;
    padding: 0;
}

.kochi-ai-access-info ul li {
    padding: 15px 0;
    border-bottom: 1px solid #eee;
    color: #555;
    line-height: 1.6;
}

.kochi-ai-access-info ul li strong {
    color: #333;
}

/* お問い合わせページ */
.kochi-ai-contact-methods {
    padding: 40px 20px;
    max-width: 800px;
    margin: 0 auto;
}

.kochi-ai-contact-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.kochi-ai-contact-card {
    background: #fff;
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.kochi-ai-contact-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.kochi-ai-contact-icon i {
    font-size: 32px;
    color: #fff;
}

.kochi-ai-contact-card h3 {
    font-size: 18px;
    color: #333;
    margin-bottom: 15px;
}

.kochi-ai-contact-number {
    font-size: 28px;
    font-weight: bold;
    color: #667eea;
    margin-bottom: 10px;
}

.kochi-ai-contact-email {
    font-size: 18px;
    color: #667eea;
    margin-bottom: 10px;
}

.kochi-ai-contact-hours,
.kochi-ai-contact-note {
    font-size: 14px;
    color: #888;
}

/* お問い合わせフォーム */
.kochi-ai-contact-form {
    padding: 60px 20px;
    background: #f8f9fa;
}

.kochi-ai-contact-form-container {
    max-width: 700px;
    margin: 0 auto;
}

.kochi-ai-contact-form-note {
    text-align: center;
    color: #666;
    margin-bottom: 30px;
}

.kochi-ai-form-wrapper {
    background: #fff;
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

/* お問い合わせ情報 */
.kochi-ai-contact-info {
    padding: 40px 20px;
}

.kochi-ai-contact-info-container {
    max-width: 800px;
    margin: 0 auto;
}

.kochi-ai-info-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.kochi-ai-info-item {
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

.kochi-ai-info-item i {
    font-size: 24px;
    color: #667eea;
    margin-top: 5px;
}

.kochi-ai-info-item strong {
    display: block;
    color: #333;
    margin-bottom: 5px;
}

.kochi-ai-info-item p {
    color: #666;
    margin: 0;
}

/* FAQページ */
.kochi-ai-faq-content {
    padding: 40px 20px;
    max-width: 800px;
    margin: 0 auto;
}

.kochi-ai-faq-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.kochi-ai-faq-item {
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
}

.kochi-ai-faq-question {
    padding: 20px 25px;
    cursor: pointer;
    background: #f8f9fa;
    transition: background 0.3s;
}

.kochi-ai-faq-question:hover {
    background: #e9ecef;
}

.kochi-ai-faq-question h3 {
    font-size: 16px;
    color: #333;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.kochi-ai-faq-question i {
    color: #667eea;
}

.kochi-ai-faq-answer {
    padding: 20px 25px;
    border-top: 1px solid #eee;
}

.kochi-ai-faq-answer p {
    color: #555;
    line-height: 1.8;
    margin: 0;
}

/* CTAセクション */
.kochi-ai-cta {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 80px 20px;
    text-align: center;
    color: #fff;
    margin-top: 40px;
}

.kochi-ai-cta-container {
    max-width: 600px;
    margin: 0 auto;
}

.kochi-ai-cta h2 {
    font-size: 28px;
    margin-bottom: 20px;
}

.kochi-ai-cta p {
    font-size: 16px;
    opacity: 0.9;
    margin-bottom: 30px;
    line-height: 1.8;
}

.kochi-ai-cta-btn {
    display: inline-block;
    background: #fff;
    color: #667eea;
    padding: 15px 40px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    transition: transform 0.3s, box-shadow 0.3s;
}

.kochi-ai-cta-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    color: #667eea;
    text-decoration: none;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .kochi-ai-page-header {
        padding: 60px 15px;
    }

    .kochi-ai-page-title {
        font-size: 28px;
    }

    .kochi-ai-solution-item {
        flex-direction: column;
        text-align: center;
    }

    .kochi-ai-solution-icon {
        margin: 0 auto;
    }

    .kochi-ai-case-item {
        flex-direction: column;
    }

    .kochi-ai-case-image {
        flex: none;
        height: 200px;
    }

    .kochi-ai-case-results {
        justify-content: center;
    }

    .kochi-ai-process-steps {
        flex-direction: column;
    }

    .kochi-ai-contact-grid,
    .kochi-ai-info-grid {
        grid-template-columns: 1fr;
    }

    .kochi-ai-company-table th,
    .kochi-ai-company-table td {
        display: block;
        width: 100%;
    }

    .kochi-ai-company-table th {
        border-bottom: none;
        padding-bottom: 5px;
    }

    .kochi-ai-company-table td {
        padding-top: 5px;
    }

    .kochi-ai-access-content {
        flex-direction: column;
    }
}

/* ================================================== */
/* 高知AI トップページ用スタイル */
/* ================================================== */

/* ヒーローセクション */
.kochi-ai-hero {
    background: linear-gradient(135deg, #1a365d 0%, #2d3748 50%, #1a202c 100%);
    padding: 120px 20px 100px;
    text-align: center;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.kochi-ai-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1920&h=1080&fit=crop') center/cover;
    opacity: 0.15;
}

.kochi-ai-hero-container {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.kochi-ai-hero-label {
    display: inline-block;
    background: rgba(102, 126, 234, 0.3);
    border: 1px solid rgba(102, 126, 234, 0.5);
    padding: 10px 25px;
    border-radius: 30px;
    font-size: 13px;
    letter-spacing: 3px;
    margin-bottom: 30px;
    color: #a5b4fc;
}

.kochi-ai-hero-title {
    font-size: 42px;
    font-weight: bold;
    margin: 0 0 25px;
    line-height: 1.4;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

.kochi-ai-hero-description {
    font-size: 18px;
    line-height: 1.9;
    opacity: 0.9;
    margin-bottom: 40px;
}

.kochi-ai-hero-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.kochi-ai-hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 35px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
}

.kochi-ai-hero-btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4);
}

.kochi-ai-hero-btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(102, 126, 234, 0.5);
    color: #fff;
    text-decoration: none;
}

.kochi-ai-hero-btn-secondary {
    background: transparent;
    border: 2px solid rgba(255,255,255,0.5);
    color: #fff;
}

.kochi-ai-hero-btn-secondary:hover {
    background: rgba(255,255,255,0.1);
    border-color: #fff;
    color: #fff;
    text-decoration: none;
}

/* ABOUTセクション */
.about-section {
    padding: 100px 20px;
    background: #f8fafc;
    position: relative;
    overflow: hidden;
}

.about-deco {
    position: absolute;
    border-radius: 50%;
    opacity: 0.1;
}

.about-deco-blue-tr {
    width: 300px;
    height: 300px;
    background: #667eea;
    top: -100px;
    right: -100px;
}

.about-deco-cyan {
    width: 200px;
    height: 200px;
    background: #06b6d4;
    top: 50%;
    left: -50px;
}

.about-deco-blue-bl {
    width: 250px;
    height: 250px;
    background: #3b82f6;
    bottom: -80px;
    left: 20%;
}

.about-deco-teal {
    width: 150px;
    height: 150px;
    background: #14b8a6;
    bottom: 100px;
    right: 10%;
}

.about-inner {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    gap: 60px;
    align-items: center;
    position: relative;
    z-index: 1;
}

.about-images {
    flex: 1;
    position: relative;
}

.about-img-main {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

.about-img-main img {
    width: 100%;
    display: block;
}

.about-img-sub {
    position: absolute;
    bottom: -30px;
    right: -30px;
    width: 180px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    border: 4px solid #fff;
}

.about-img-sub img {
    width: 100%;
    display: block;
}

.about-text-area {
    flex: 1;
}

.about-en {
    font-size: 13px;
    letter-spacing: 3px;
    color: #667eea;
    margin-bottom: 10px;
    font-weight: bold;
}

.about-title {
    font-size: 36px;
    color: #1a365d;
    margin: 0 0 30px;
    font-weight: bold;
}

.about-desc {
    color: #4a5568;
    line-height: 2;
    margin-bottom: 30px;
}

.about-desc p {
    margin-bottom: 15px;
}

.about-desc strong {
    color: #667eea;
}

.about-btn {
    display: inline-block;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 14px 35px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    transition: all 0.3s ease;
}

.about-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(102,126,234,0.4);
    color: #fff;
    text-decoration: none;
}

/* テックバックグラウンドセクション */
.kochi-ai-tech-bg-section {
    height: 100px;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

/* サービスセクション */
.kochi-ai-services-section {
    padding: 80px 20px;
    background: #fff;
}

.kochi-ai-services-container {
    max-width: 1000px;
    margin: 0 auto;
}

.kochi-ai-services-title {
    text-align: center;
    margin-bottom: 50px;
}

.services-en {
    font-size: 13px;
    letter-spacing: 3px;
    color: #667eea;
    margin-bottom: 10px;
    font-weight: bold;
}

.services-heading {
    font-size: 32px;
    color: #1a365d;
    margin: 0;
    font-weight: bold;
}

.kochi-ai-swiper {
    margin-bottom: 40px;
}

.kochi-ai-swiper .swiper-slide {
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.kochi-ai-swiper .swiper-slide img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.kochi-ai-services-text {
    text-align: center;
    color: #4a5568;
    line-height: 2;
    margin-bottom: 30px;
}

.kochi-ai-services-text p {
    margin: 5px 0;
}

.kochi-ai-services-text strong {
    color: #667eea;
}

.kochi-ai-services-button {
    text-align: center;
}

.kochi-ai-btn-more {
    display: inline-block;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 14px 35px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    transition: all 0.3s ease;
}

.kochi-ai-btn-more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(102,126,234,0.4);
    color: #fff;
    text-decoration: none;
}

/* DXギャラリーセクション */
.kochi-ai-dx-gallery-section {
    padding: 80px 20px;
    background: #f8fafc;
}

.kochi-ai-dx-gallery-container {
    max-width: 1200px;
    margin: 0 auto;
}

.kochi-ai-dx-gallery-header {
    text-align: center;
    margin-bottom: 50px;
}

.dx-en {
    font-size: 13px;
    letter-spacing: 3px;
    color: #667eea;
    margin-bottom: 10px;
    font-weight: bold;
}

.dx-heading {
    font-size: 32px;
    color: #1a365d;
    margin: 0 0 15px;
    font-weight: bold;
}

.kochi-ai-gallery-subtitle {
    color: #64748b;
    font-size: 16px;
}

.kochi-ai-dx-gallery-content {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

.kochi-ai-dx-image-gallery {
    flex: 1;
    min-width: 300px;
}

.kochi-ai-gallery-row {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.kochi-ai-gallery-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.kochi-ai-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.kochi-ai-gallery-item:hover img {
    transform: scale(1.05);
}

.kochi-ai-small {
    flex: 0 0 calc(33% - 10px);
    height: 120px;
}

.kochi-ai-medium {
    flex: 0 0 calc(50% - 8px);
    height: 160px;
}

.kochi-ai-large {
    flex: 0 0 calc(66% - 8px);
    height: 200px;
}

.kochi-ai-gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.7));
    padding: 20px 15px 15px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.kochi-ai-gallery-item:hover .kochi-ai-gallery-overlay {
    opacity: 1;
}

.kochi-ai-gallery-label {
    color: #fff;
    font-size: 14px;
    font-weight: bold;
}

.kochi-ai-dx-gallery-text {
    flex: 1;
    min-width: 300px;
}

.kochi-ai-gallery-section-title {
    font-size: 24px;
    color: #1a365d;
    margin-bottom: 20px;
}

.kochi-ai-gallery-description {
    color: #4a5568;
    line-height: 1.9;
    margin-bottom: 30px;
}

.kochi-ai-gallery-btn {
    display: inline-block;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 12px 30px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    transition: all 0.3s ease;
}

.kochi-ai-gallery-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(102,126,234,0.4);
    color: #fff;
    text-decoration: none;
}

.kochi-ai-gallery-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 30px;
}

.kochi-ai-feature-item {
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

.kochi-ai-feature-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.kochi-ai-feature-icon i {
    color: #fff;
    font-size: 20px;
}

.kochi-ai-feature-text h4 {
    font-size: 16px;
    color: #1a365d;
    margin: 0 0 5px;
}

.kochi-ai-feature-text p {
    font-size: 14px;
    color: #64748b;
    margin: 0;
}

/* コンタクトセクション */
.contact-clean-2024 {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 100px 20px;
    position: relative;
    overflow: hidden;
}

.wave-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    overflow: hidden;
}

.wave {
    position: absolute;
    width: 200%;
    height: 100%;
    background: rgba(255,255,255,0.1);
    border-radius: 40%;
}

.wave.layer1 {
    animation: wave 8s linear infinite;
}

.wave.layer2 {
    animation: wave 10s linear infinite reverse;
    opacity: 0.5;
}

@keyframes wave {
    0% { transform: translateX(0) rotate(0deg); }
    100% { transform: translateX(-50%) rotate(360deg); }
}

.contact-clean-wrapper {
    max-width: 700px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.contact-clean-card {
    background: rgba(255,255,255,0.95);
    border-radius: 25px;
    padding: 60px 50px;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}

.contact-clean-title {
    font-size: 28px;
    color: #1a365d;
    margin: 0 0 20px;
    font-weight: bold;
}

.contact-clean-description {
    color: #4a5568;
    line-height: 1.8;
    margin-bottom: 35px;
}

.contact-clean-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.contact-clean-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 35px;
    border-radius: 30px;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
}

.contact-clean-mail {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
}

.contact-clean-mail:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(102,126,234,0.4);
    color: #fff;
    text-decoration: none;
}

.contact-clean-phone {
    background: #fff;
    color: #667eea;
    border: 2px solid #667eea;
}

.contact-clean-phone:hover {
    background: #667eea;
    color: #fff;
    text-decoration: none;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    .kochi-ai-hero {
        padding: 80px 15px 60px;
    }

    .kochi-ai-hero-title {
        font-size: 28px;
    }

    .kochi-ai-hero-description {
        font-size: 15px;
    }

    .kochi-ai-hero-buttons {
        flex-direction: column;
        align-items: center;
    }

    .about-inner {
        flex-direction: column;
        gap: 40px;
    }

    .about-img-sub {
        position: relative;
        bottom: auto;
        right: auto;
        width: 120px;
        margin-top: -50px;
        margin-left: auto;
    }

    .about-title {
        font-size: 28px;
    }

    .services-heading,
    .dx-heading {
        font-size: 26px;
    }

    .kochi-ai-dx-gallery-content {
        flex-direction: column;
    }

    .kochi-ai-gallery-item {
        flex: 0 0 100% !important;
        height: 180px !important;
    }

    .contact-clean-card {
        padding: 40px 25px;
    }

    .contact-clean-title {
        font-size: 24px;
    }

    .contact-clean-buttons {
        flex-direction: column;
    }
}

/* ================================================== */
/* 高知AI 修正CSS - 上書き用 */
/* ================================================== */

/* ヒーローセクション - 白背景・黒文字に修正 */
.kochi-ai-hero {
    background: #ffffff !important;
    padding: 100px 20px 80px !important;
    text-align: center !important;
    color: #333 !important;
    position: relative !important;
    overflow: hidden !important;
}

.kochi-ai-hero::before {
    display: none !important;
}

.kochi-ai-hero-container {
    max-width: 900px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

.kochi-ai-hero-label {
    display: inline-block !important;
    background: #f0f4ff !important;
    border: 1px solid #667eea !important;
    padding: 10px 25px !important;
    border-radius: 30px !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
    margin-bottom: 30px !important;
    color: #667eea !important;
}

.kochi-ai-hero-title {
    font-size: 38px !important;
    font-weight: bold !important;
    margin: 0 0 25px !important;
    line-height: 1.5 !important;
    color: #1a365d !important;
}

.kochi-ai-hero-description {
    font-size: 17px !important;
    line-height: 1.9 !important;
    color: #4a5568 !important;
    margin-bottom: 40px !important;
}

.kochi-ai-hero-buttons {
    display: flex !important;
    gap: 20px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}

.kochi-ai-hero-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 35px !important;
    border-radius: 30px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.kochi-ai-hero-btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4) !important;
}

.kochi-ai-hero-btn-primary:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 30px rgba(102, 126, 234, 0.5) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.kochi-ai-hero-btn-secondary {
    background: transparent !important;
    border: 2px solid #667eea !important;
    color: #667eea !important;
}

.kochi-ai-hero-btn-secondary:hover {
    background: #667eea !important;
    color: #fff !important;
    text-decoration: none !important;
}

/* ABOUTセクション修正 */
.about-section {
    padding: 80px 20px !important;
    background: #f8fafc !important;
    position: relative !important;
    overflow: hidden !important;
}

.about-inner {
    max-width: 1100px !important;
    margin: 0 auto !important;
    display: flex !important;
    gap: 60px !important;
    align-items: center !important;
    position: relative !important;
    z-index: 1 !important;
}

.about-images {
    flex: 0 0 45% !important;
    position: relative !important;
}

.about-text-area {
    flex: 0 0 50% !important;
}

.about-title {
    font-size: 32px !important;
    color: #1a365d !important;
    margin: 0 0 25px !important;
    font-weight: bold !important;
}

.about-desc {
    color: #4a5568 !important;
    line-height: 2 !important;
    margin-bottom: 30px !important;
}

.about-desc p {
    margin-bottom: 12px !important;
    font-size: 16px !important;
}

/* サービスセクション修正 */
.kochi-ai-services-section {
    padding: 80px 20px !important;
    background: #fff !important;
}

.kochi-ai-services-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

/* Swiperスライダー修正 */
.kochi-ai-swiper {
    margin-bottom: 40px !important;
    overflow: hidden !important;
}

.kochi-ai-swiper .swiper-wrapper {
    display: flex !important;
}

.kochi-ai-swiper .swiper-slide {
    flex: 0 0 auto !important;
    width: 300px !important;
    margin-right: 20px !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1) !important;
}

.kochi-ai-swiper .swiper-slide img {
    width: 100% !important;
    height: 200px !important;
    object-fit: cover !important;
    display: block !important;
}

.kochi-ai-services-text {
    text-align: center !important;
    color: #4a5568 !important;
    line-height: 2 !important;
    margin-bottom: 30px !important;
}

/* DXギャラリーセクション修正 */
.kochi-ai-dx-gallery-section {
    padding: 80px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-dx-gallery-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

.kochi-ai-dx-gallery-content {
    display: flex !important;
    gap: 50px !important;
    align-items: flex-start !important;
}

.kochi-ai-dx-image-gallery {
    flex: 0 0 55% !important;
}

.kochi-ai-gallery-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 15px !important;
}

.kochi-ai-gallery-item {
    position: relative !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
    height: 150px !important;
}

.kochi-ai-gallery-item.kochi-ai-small,
.kochi-ai-gallery-item.kochi-ai-medium,
.kochi-ai-gallery-item.kochi-ai-large {
    flex: none !important;
    width: 100% !important;
    height: 150px !important;
}

.kochi-ai-gallery-item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.kochi-ai-dx-gallery-text {
    flex: 0 0 40% !important;
}

.kochi-ai-gallery-section-title {
    font-size: 24px !important;
    color: #1a365d !important;
    margin-bottom: 20px !important;
}

.kochi-ai-gallery-description {
    color: #4a5568 !important;
    line-height: 1.9 !important;
    margin-bottom: 25px !important;
}

.kochi-ai-gallery-features {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    margin-top: 30px !important;
}

.kochi-ai-feature-item {
    display: flex !important;
    gap: 15px !important;
    align-items: center !important;
}

.kochi-ai-feature-icon {
    width: 50px !important;
    height: 50px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.kochi-ai-feature-icon i {
    color: #fff !important;
    font-size: 20px !important;
}

.kochi-ai-feature-text h4 {
    font-size: 16px !important;
    color: #1a365d !important;
    margin: 0 0 5px !important;
}

.kochi-ai-feature-text p {
    font-size: 14px !important;
    color: #64748b !important;
    margin: 0 !important;
}

/* コンタクトセクション修正 */
.contact-clean-2024 {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    position: relative !important;
    overflow: visible !important;
}

.wave-container {
    display: none !important;
}

.contact-clean-wrapper {
    max-width: 700px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

.contact-clean-card {
    background: #fff !important;
    border-radius: 25px !important;
    padding: 50px 40px !important;
    text-align: center !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2) !important;
}

.contact-clean-title {
    font-size: 26px !important;
    color: #1a365d !important;
    margin: 0 0 20px !important;
    font-weight: bold !important;
}

.contact-clean-description {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    margin-bottom: 30px !important;
}

.contact-clean-description p {
    margin: 0 !important;
}

.contact-clean-buttons {
    display: flex !important;
    gap: 20px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}

.contact-clean-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 30px !important;
    border-radius: 30px !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.contact-clean-mail {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
}

.contact-clean-mail:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 30px rgba(102,126,234,0.4) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.contact-clean-phone {
    background: #fff !important;
    color: #667eea !important;
    border: 2px solid #667eea !important;
}

.contact-clean-phone:hover {
    background: #667eea !important;
    color: #fff !important;
    text-decoration: none !important;
}

.contact-clean-text {
    display: inline !important;
}

.contact-clean-icon {
    font-size: 18px !important;
}

/* レスポンシブ修正 */
@media screen and (max-width: 768px) {
    .kochi-ai-hero {
        padding: 60px 15px 50px !important;
    }

    .kochi-ai-hero-title {
        font-size: 26px !important;
    }

    .kochi-ai-hero-description {
        font-size: 15px !important;
    }

    .kochi-ai-hero-buttons {
        flex-direction: column !important;
        align-items: center !important;
    }

    .about-inner {
        flex-direction: column !important;
        gap: 40px !important;
    }

    .about-images,
    .about-text-area {
        flex: none !important;
        width: 100% !important;
    }

    .about-title {
        font-size: 26px !important;
    }

    .kochi-ai-dx-gallery-content {
        flex-direction: column !important;
    }

    .kochi-ai-dx-image-gallery,
    .kochi-ai-dx-gallery-text {
        flex: none !important;
        width: 100% !important;
    }

    .kochi-ai-gallery-row {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .contact-clean-card {
        padding: 35px 25px !important;
    }

    .contact-clean-title {
        font-size: 22px !important;
    }

    .contact-clean-buttons {
        flex-direction: column !important;
    }
}

/* ================================================== */
/* 高知AI 修正CSS その2 */
/* ================================================== */

/* サービスセクション - スライダー修正 */
.kochi-ai-services-section {
    padding: 80px 20px !important;
    background: #fff !important;
}

.kochi-ai-swiper {
    width: 100% !important;
    overflow: visible !important;
    margin-bottom: 40px !important;
}

.kochi-ai-swiper .swiper-wrapper {
    display: flex !important;
    animation: slide-scroll 20s linear infinite !important;
}

@keyframes slide-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

.kochi-ai-swiper .swiper-slide {
    flex: 0 0 280px !important;
    width: 280px !important;
    height: 200px !important;
    margin-right: 20px !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1) !important;
}

.kochi-ai-swiper .swiper-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* DXギャラリーセクション - レイアウト修正 */
.kochi-ai-dx-gallery-section {
    padding: 80px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-dx-gallery-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-dx-gallery-header {
    text-align: center !important;
    margin-bottom: 40px !important;
}

/* コンテンツを縦並びに変更 */
.kochi-ai-dx-gallery-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 50px !important;
}

/* 画像ギャラリー - フル幅 */
.kochi-ai-dx-image-gallery {
    width: 100% !important;
    flex: none !important;
}

.kochi-ai-gallery-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 15px !important;
}

.kochi-ai-gallery-item {
    position: relative !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
    height: 180px !important;
}

.kochi-ai-gallery-item.kochi-ai-small,
.kochi-ai-gallery-item.kochi-ai-medium,
.kochi-ai-gallery-item.kochi-ai-large {
    flex: none !important;
    width: 100% !important;
    height: 180px !important;
}

.kochi-ai-gallery-item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.3s ease !important;
}

.kochi-ai-gallery-item:hover img {
    transform: scale(1.05) !important;
}

/* テキストエリア - フル幅で下に配置 */
.kochi-ai-dx-gallery-text {
    width: 100% !important;
    flex: none !important;
    text-align: center !important;
}

.kochi-ai-gallery-text-content {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-gallery-section-title {
    font-size: 26px !important;
    color: #1a365d !important;
    margin-bottom: 20px !important;
    text-align: center !important;
}

.kochi-ai-gallery-content-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 40px !important;
}

.kochi-ai-gallery-description {
    color: #4a5568 !important;
    line-height: 1.9 !important;
    text-align: center !important;
}

.kochi-ai-gallery-button-inline {
    text-align: center !important;
    margin-top: 20px !important;
}

/* 特徴アイコン - 横並び3つ */
.kochi-ai-gallery-features-wrapper {
    width: 100% !important;
}

.kochi-ai-gallery-features {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    gap: 40px !important;
    margin-top: 30px !important;
    flex-wrap: wrap !important;
}

.kochi-ai-feature-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 15px !important;
    flex: 0 0 200px !important;
}

.kochi-ai-feature-icon {
    width: 70px !important;
    height: 70px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.kochi-ai-feature-icon i {
    color: #fff !important;
    font-size: 28px !important;
}

.kochi-ai-feature-text {
    text-align: center !important;
}

.kochi-ai-feature-text h4 {
    font-size: 18px !important;
    color: #1a365d !important;
    margin: 0 0 8px !important;
}

.kochi-ai-feature-text p {
    font-size: 14px !important;
    color: #64748b !important;
    margin: 0 !important;
}

/* コンタクトセクション - 完全修正 */
.contact-clean-2024 {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 100px 20px 100px !important;
    position: relative !important;
    overflow: visible !important;
    min-height: auto !important;
}

.wave-container {
    display: none !important;
}

.contact-clean-wrapper {
    max-width: 700px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 1 !important;
}

.contact-clean-card {
    background: #fff !important;
    border-radius: 25px !important;
    padding: 60px 50px !important;
    text-align: center !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2) !important;
}

.contact-clean-title {
    font-size: 28px !important;
    color: #1a365d !important;
    margin: 0 0 25px !important;
    font-weight: bold !important;
}

.contact-clean-description {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    margin-bottom: 35px !important;
}

.contact-clean-description p {
    margin: 0 !important;
}

.contact-clean-buttons {
    display: flex !important;
    gap: 25px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
}

.contact-clean-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 18px 40px !important;
    border-radius: 50px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    min-width: 220px !important;
}

.contact-clean-mail {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 15px rgba(102,126,234,0.4) !important;
}

.contact-clean-mail:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(102,126,234,0.5) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.contact-clean-phone {
    background: #fff !important;
    color: #667eea !important;
    border: 2px solid #667eea !important;
}

.contact-clean-phone:hover {
    background: #667eea !important;
    color: #fff !important;
    text-decoration: none !important;
}

.contact-clean-text {
    display: inline !important;
}

.contact-clean-icon {
    font-size: 20px !important;
}

/* フッター前の余白確保 */
.contact-clean-2024 + * {
    margin-top: 0 !important;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    .kochi-ai-swiper .swiper-slide {
        flex: 0 0 200px !important;
        width: 200px !important;
        height: 150px !important;
    }

    .kochi-ai-gallery-row {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .kochi-ai-gallery-item,
    .kochi-ai-gallery-item.kochi-ai-small,
    .kochi-ai-gallery-item.kochi-ai-medium,
    .kochi-ai-gallery-item.kochi-ai-large {
        height: 140px !important;
    }

    .kochi-ai-gallery-features {
        flex-direction: column !important;
        align-items: center !important;
        gap: 30px !important;
    }

    .kochi-ai-feature-item {
        flex: none !important;
        width: 100% !important;
        max-width: 250px !important;
    }

    .contact-clean-card {
        padding: 40px 25px !important;
    }

    .contact-clean-title {
        font-size: 24px !important;
    }

    .contact-clean-buttons {
        flex-direction: column !important;
        align-items: center !important;
    }

    .contact-clean-btn {
        width: 100% !important;
        max-width: 280px !important;
    }
}

/* ================================================== */
/* 高知AI コンタクトセクション 最終修正 */
/* ================================================== */

/* コンタクトセクション - 背景とレイアウト完全修正 */
section.contact-clean-2024 {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px 80px 20px !important;
    margin: 0 !important;
    position: relative !important;
    overflow: visible !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    min-height: 400px !important;
}

section.contact-clean-2024 .wave-container {
    display: none !important;
}

section.contact-clean-2024 .contact-clean-wrapper {
    max-width: 750px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    position: relative !important;
    z-index: 10 !important;
}

section.contact-clean-2024 .contact-clean-card {
    background: #ffffff !important;
    border-radius: 20px !important;
    padding: 50px 40px 50px 40px !important;
    text-align: center !important;
    box-shadow: 0 15px 50px rgba(0,0,0,0.15) !important;
    margin: 0 !important;
}

section.contact-clean-2024 .contact-clean-title {
    font-size: 28px !important;
    color: #1a365d !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    font-weight: bold !important;
    line-height: 1.4 !important;
}

section.contact-clean-2024 .contact-clean-description {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    margin: 0 0 30px 0 !important;
    padding: 0 !important;
}

section.contact-clean-2024 .contact-clean-description p {
    margin: 0 !important;
    padding: 0 !important;
}

section.contact-clean-2024 .contact-clean-buttons {
    display: flex !important;
    gap: 20px !important;
    justify-content: center !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ボタン内の余分なbrタグを非表示 */
section.contact-clean-2024 .contact-clean-btn br {
    display: none !important;
}

section.contact-clean-2024 .contact-clean-btn {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 18px 35px !important;
    border-radius: 50px !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    min-width: 200px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

section.contact-clean-2024 .contact-clean-mail {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 15px rgba(102,126,234,0.4) !important;
}

section.contact-clean-2024 .contact-clean-mail:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(102,126,234,0.5) !important;
    color: #fff !important;
    text-decoration: none !important;
}

section.contact-clean-2024 .contact-clean-phone {
    background: #ffffff !important;
    color: #667eea !important;
    border: 2px solid #667eea !important;
}

section.contact-clean-2024 .contact-clean-phone:hover {
    background: #667eea !important;
    color: #fff !important;
    text-decoration: none !important;
}

section.contact-clean-2024 .contact-clean-text {
    display: inline !important;
}

section.contact-clean-2024 .contact-clean-icon {
    font-size: 18px !important;
    display: inline !important;
}

/* 余分な</p>タグの影響を消す */
section.contact-clean-2024 p:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    section.contact-clean-2024 {
        padding: 60px 15px 60px 15px !important;
        min-height: 350px !important;
    }

    section.contact-clean-2024 .contact-clean-card {
        padding: 40px 25px 40px 25px !important;
    }

    section.contact-clean-2024 .contact-clean-title {
        font-size: 24px !important;
    }

    section.contact-clean-2024 .contact-clean-buttons {
        flex-direction: column !important;
        align-items: center !important;
    }

    section.contact-clean-2024 .contact-clean-btn {
        width: 100% !important;
        max-width: 280px !important;
    }
}

/* ================================================== */
/* 高知AI 全ページ共通スタイル */
/* ================================================== */

/* 背景画像を無効化 */
body::before {
    display: none !important;
}

body {
    background: #f8fafc !important;
}

/* ================================================== */
/* ABOUTページ */
/* ================================================== */

.kochi-ai-about-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
}

.kochi-ai-about-header-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-about-label {
    display: inline-block !important;
    background: rgba(255,255,255,0.2) !important;
    padding: 8px 20px !important;
    border-radius: 30px !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
    margin-bottom: 20px !important;
}

.kochi-ai-about-title {
    font-size: 36px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #fff !important;
}

.kochi-ai-about-subtitle {
    font-size: 16px !important;
    opacity: 0.9 !important;
    line-height: 1.8 !important;
}

/* ABOUTページ本文 */
.about-page {
    background: #fff !important;
}

.about-message,
.about-strengths,
.about-features {
    padding: 60px 20px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.about-section-title {
    font-size: 28px !important;
    text-align: center !important;
    color: #1a365d !important;
    margin-bottom: 30px !important;
}

.about-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.about-text {
    color: #4a5568 !important;
    line-height: 2 !important;
    text-align: center !important;
}

/* 強み3つ */
.about-strengths-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px !important;
    margin-top: 40px !important;
}

.about-strength-item {
    background: #fff !important;
    padding: 40px 25px !important;
    border-radius: 15px !important;
    text-align: center !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
}

.about-strength-icon {
    width: 70px !important;
    height: 70px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
}

.about-strength-icon i {
    font-size: 28px !important;
    color: #fff !important;
}

.about-strength-title {
    font-size: 18px !important;
    color: #1a365d !important;
    margin-bottom: 15px !important;
}

.about-strength-desc {
    font-size: 14px !important;
    color: #64748b !important;
    line-height: 1.8 !important;
}

/* ================================================== */
/* SERVICEページ */
/* ================================================== */

.kochi-ai-service-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
}

.kochi-ai-service-header-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-service-label {
    display: inline-block !important;
    background: rgba(255,255,255,0.2) !important;
    padding: 8px 20px !important;
    border-radius: 30px !important;
    font-size: 13px !important;
    letter-spacing: 3px !important;
    margin-bottom: 20px !important;
}

.kochi-ai-service-title {
    font-size: 36px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #fff !important;
}

.kochi-ai-service-subtitle {
    font-size: 16px !important;
    opacity: 0.9 !important;
    line-height: 1.8 !important;
}

/* サービス概要 */
.kochi-ai-services-overview {
    padding: 60px 20px !important;
    background: #fff !important;
}

.kochi-ai-services-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-services-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
}

.kochi-ai-service-card {
    background: #f8fafc !important;
    padding: 35px !important;
    border-radius: 15px !important;
    text-align: center !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.kochi-ai-service-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
}

.kochi-ai-service-card-icon {
    width: 60px !important;
    height: 60px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
}

.kochi-ai-service-card-icon i {
    font-size: 24px !important;
    color: #fff !important;
}

.kochi-ai-service-card-title {
    font-size: 20px !important;
    color: #1a365d !important;
    margin-bottom: 15px !important;
}

.kochi-ai-service-card-desc {
    font-size: 14px !important;
    color: #64748b !important;
    line-height: 1.8 !important;
}

/* サービス詳細 */
.kochi-ai-service-detail {
    padding: 60px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-service-detail:nth-child(even) {
    background: #fff !important;
}

.kochi-ai-service-detail-container {
    max-width: 900px !important;
    margin: 0 auto !important;
}

.kochi-ai-service-detail-title {
    font-size: 26px !important;
    color: #1a365d !important;
    margin-bottom: 20px !important;
    text-align: center !important;
    position: relative !important;
    padding-bottom: 15px !important;
}

.kochi-ai-service-detail-title::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 50px !important;
    height: 3px !important;
    background: linear-gradient(90deg, #667eea, #764ba2) !important;
}

.kochi-ai-service-detail-content {
    display: flex !important;
    gap: 40px !important;
    align-items: flex-start !important;
    margin-top: 30px !important;
}

.kochi-ai-service-detail-image {
    flex: 0 0 40% !important;
    border-radius: 15px !important;
    overflow: hidden !important;
}

.kochi-ai-service-detail-image img {
    width: 100% !important;
    display: block !important;
}

.kochi-ai-service-detail-text {
    flex: 1 !important;
}

.kochi-ai-service-detail-desc {
    color: #4a5568 !important;
    line-height: 1.9 !important;
    margin-bottom: 20px !important;
}

.kochi-ai-service-detail-list {
    list-style: none !important;
    padding: 0 !important;
}

.kochi-ai-service-detail-list li {
    padding: 10px 0 !important;
    padding-left: 25px !important;
    position: relative !important;
    color: #4a5568 !important;
}

.kochi-ai-service-detail-list li::before {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    color: #667eea !important;
    font-weight: bold !important;
}

/* ================================================== */
/* SOLUTIONページ - ヘッダー画像版 */
/* ================================================== */

.kochi-ai-page-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
    position: relative !important;
}

/* 背景画像付きバージョン */
.kochi-ai-page-header.with-image {
    background: linear-gradient(rgba(102, 126, 234, 0.9), rgba(118, 75, 162, 0.9)),
                url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1920') center/cover !important;
    min-height: 300px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ================================================== */
/* レスポンシブ */
/* ================================================== */

@media screen and (max-width: 768px) {
    .kochi-ai-about-title,
    .kochi-ai-service-title {
        font-size: 28px !important;
    }

    .about-strengths-grid {
        grid-template-columns: 1fr !important;
    }

    .kochi-ai-services-grid {
        grid-template-columns: 1fr !important;
    }

    .kochi-ai-service-detail-content {
        flex-direction: column !important;
    }

    .kochi-ai-service-detail-image {
        flex: none !important;
        width: 100% !important;
    }
}

/* ================================================== */
/* サービスページ 詳細スタイル修正 */
/* ================================================== */

/* サービス概要グリッド */
.kochi-ai-services-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
    margin-top: 20px !important;
}

.kochi-ai-service-item {
    background: #fff !important;
    padding: 40px 30px !important;
    border-radius: 15px !important;
    text-align: center !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.kochi-ai-service-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12) !important;
}

.kochi-ai-service-icon {
    width: 70px !important;
    height: 70px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
}

.kochi-ai-service-icon i {
    font-size: 28px !important;
    color: #fff !important;
}

.kochi-ai-service-item h3 {
    font-size: 20px !important;
    color: #1a365d !important;
    margin: 0 0 15px 0 !important;
}

.kochi-ai-service-item p {
    font-size: 14px !important;
    color: #64748b !important;
    line-height: 1.8 !important;
    margin: 0 !important;
}

/* サービス詳細セクション */
.kochi-ai-service-detail {
    padding: 70px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-service-detail:nth-child(odd) {
    background: #fff !important;
}

.kochi-ai-service-detail-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-service-content {
    display: flex !important;
    gap: 50px !important;
    align-items: center !important;
    margin-top: 30px !important;
}

.kochi-ai-service-text {
    flex: 1 !important;
}

.kochi-ai-service-text p {
    color: #4a5568 !important;
    line-height: 1.9 !important;
    margin-bottom: 20px !important;
    font-size: 16px !important;
}

.kochi-ai-service-text ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.kochi-ai-service-text ul li {
    padding: 12px 0 !important;
    padding-left: 30px !important;
    position: relative !important;
    color: #4a5568 !important;
    font-size: 15px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.kochi-ai-service-text ul li:last-child {
    border-bottom: none !important;
}

.kochi-ai-service-text ul li::before {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    color: #667eea !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

.kochi-ai-service-image {
    flex: 0 0 45% !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
}

.kochi-ai-service-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    .kochi-ai-services-grid {
        grid-template-columns: 1fr !important;
    }

    .kochi-ai-service-content {
        flex-direction: column !important;
    }

    .kochi-ai-service-image {
        flex: none !important;
        width: 100% !important;
        order: -1 !important;
    }
}

/* ================================================== */
/* 高知AI Aboutページ 完全スタイル */
/* ================================================== */

/* Aboutページヘッダー */
.kochi-ai-about-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
    margin-bottom: 0 !important;
}

.kochi-ai-about-header-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-about-label {
    display: inline-block !important;
    background: rgba(255,255,255,0.2) !important;
    padding: 8px 20px !important;
    border-radius: 30px !important;
    font-size: 14px !important;
    letter-spacing: 2px !important;
    margin-bottom: 20px !important;
    color: #fff !important;
}

.kochi-ai-about-title {
    font-size: 36px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #fff !important;
}

.kochi-ai-about-subtitle {
    font-size: 16px !important;
    opacity: 0.9 !important;
    line-height: 1.8 !important;
    color: #fff !important;
}

/* Aboutページ共通 */
.about-page {
    background: #f8f9fa !important;
}

.about-page section {
    padding: 60px 0 !important;
}

.about-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

.about-section-title {
    font-size: 28px !important;
    font-weight: bold !important;
    text-align: center !important;
    margin-bottom: 40px !important;
    color: #1a365d !important;
    position: relative !important;
    padding-bottom: 15px !important;
}

.about-section-title::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 3px !important;
    background: linear-gradient(90deg, #667eea, #764ba2) !important;
}

/* ミッションセクション */
.about-message {
    background: #fff !important;
    padding: 60px 0 !important;
}

.message-content {
    background: #f8fafc !important;
    padding: 40px !important;
    border-radius: 15px !important;
}

.message-text p {
    color: #4a5568 !important;
    line-height: 2 !important;
    margin-bottom: 15px !important;
    font-size: 16px !important;
}

.message-text p:last-child {
    margin-bottom: 0 !important;
}

/* 会社概要セクション */
.about-overview {
    background: #f8fafc !important;
    padding: 60px 0 !important;
}

.overview-grid {
    display: flex !important;
    justify-content: center !important;
}

.overview-card {
    background: #fff !important;
    padding: 40px !important;
    border-radius: 15px !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
    max-width: 800px !important;
    width: 100% !important;
}

.overview-card-title {
    font-size: 22px !important;
    font-weight: bold !important;
    color: #1a365d !important;
    margin-bottom: 25px !important;
    padding-bottom: 15px !important;
    border-bottom: 3px solid #667eea !important;
}

.overview-card #table01 {
    width: 100% !important;
    border-collapse: collapse !important;
}

.overview-card #table01 th,
.overview-card #table01 td {
    padding: 15px 20px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    text-align: left !important;
}

.overview-card #table01 th {
    background: #f8fafc !important;
    color: #1a365d !important;
    font-weight: bold !important;
    width: 30% !important;
}

.overview-card #table01 td {
    color: #4a5568 !important;
}

/* 強みセクション */
.about-mission {
    background: #fff !important;
    padding: 60px 0 !important;
}

.mission-cards {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px !important;
    margin-top: 40px !important;
}

.mission-card {
    background: #f8fafc !important;
    padding: 40px 30px !important;
    border-radius: 15px !important;
    text-align: center !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08) !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.mission-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12) !important;
}

.mission-icon {
    width: 80px !important;
    height: 80px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 25px !important;
}

.mission-icon i {
    font-size: 32px !important;
    color: #fff !important;
}

.mission-title {
    font-size: 20px !important;
    font-weight: bold !important;
    color: #1a365d !important;
    margin-bottom: 15px !important;
}

.mission-description {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    font-size: 14px !important;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    .kochi-ai-about-header {
        padding: 60px 15px !important;
    }

    .kochi-ai-about-title {
        font-size: 28px !important;
    }

    .mission-cards {
        grid-template-columns: 1fr !important;
    }

    .overview-card #table01 th,
    .overview-card #table01 td {
        display: block !important;
        width: 100% !important;
    }

    .overview-card #table01 th {
        border-bottom: none !important;
        padding-bottom: 5px !important;
    }

    .overview-card #table01 td {
        padding-top: 5px !important;
    }
}

/* ================================================== */
/* 高知AI サービスページヘッダー 完全スタイル */
/* ================================================== */

/* サービスヘッダー */
.kochi-ai-service-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
    margin-bottom: 0 !important;
}

.kochi-ai-service-header-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-service-label {
    display: inline-block !important;
    background: rgba(255,255,255,0.2) !important;
    padding: 8px 20px !important;
    border-radius: 30px !important;
    font-size: 14px !important;
    letter-spacing: 2px !important;
    margin-bottom: 20px !important;
    color: #fff !important;
}

.kochi-ai-service-title {
    font-size: 36px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #fff !important;
}

.kochi-ai-service-subtitle {
    font-size: 16px !important;
    opacity: 0.9 !important;
    line-height: 1.8 !important;
    color: #fff !important;
}

/* サービス概要セクション */
.kochi-ai-services-overview {
    padding: 80px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-services-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

/* サービスグリッド（4つのアイコン付きカード） */
.kochi-ai-services-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
}

.kochi-ai-service-item {
    background: #fff !important;
    padding: 40px 30px !important;
    border-radius: 15px !important;
    text-align: center !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.kochi-ai-service-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12) !important;
}

.kochi-ai-service-icon {
    width: 70px !important;
    height: 70px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
}

.kochi-ai-service-icon i {
    font-size: 28px !important;
    color: #fff !important;
}

.kochi-ai-service-item h3 {
    font-size: 20px !important;
    color: #1a365d !important;
    margin: 0 0 15px 0 !important;
    font-weight: bold !important;
}

.kochi-ai-service-item p {
    font-size: 14px !important;
    color: #64748b !important;
    line-height: 1.8 !important;
    margin: 0 !important;
}

/* サービス詳細セクション */
.kochi-ai-service-detail {
    padding: 70px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-service-detail:nth-child(odd) {
    background: #fff !important;
}

.kochi-ai-service-detail-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-service-content {
    display: flex !important;
    gap: 50px !important;
    align-items: center !important;
    margin-top: 30px !important;
}

.kochi-ai-service-text {
    flex: 1 !important;
}

.kochi-ai-service-text p {
    color: #4a5568 !important;
    line-height: 1.9 !important;
    margin-bottom: 20px !important;
    font-size: 16px !important;
}

.kochi-ai-service-text ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.kochi-ai-service-text ul li {
    padding: 12px 0 !important;
    padding-left: 30px !important;
    position: relative !important;
    color: #4a5568 !important;
    font-size: 15px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.kochi-ai-service-text ul li:last-child {
    border-bottom: none !important;
}

.kochi-ai-service-text ul li::before {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    color: #667eea !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

.kochi-ai-service-image {
    flex: 0 0 45% !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
}

.kochi-ai-service-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* セクションタイトル */
.kochi-ai-section-title {
    font-size: 28px !important;
    text-align: center !important;
    margin: 0 0 30px 0 !important;
    color: #1a365d !important;
    position: relative !important;
    padding-bottom: 15px !important;
    font-weight: bold !important;
}

.kochi-ai-section-title::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 3px !important;
    background: linear-gradient(90deg, #667eea, #764ba2) !important;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    .kochi-ai-service-header {
        padding: 60px 15px !important;
    }

    .kochi-ai-service-title {
        font-size: 28px !important;
    }

    .kochi-ai-services-grid {
        grid-template-columns: 1fr !important;
    }

    .kochi-ai-service-content {
        flex-direction: column !important;
    }

    .kochi-ai-service-image {
        flex: none !important;
        width: 100% !important;
        order: -1 !important;
    }
}

/* ================================================== */
/* 高知AI ソリューションページ 画像ヘッダー */
/* ================================================== */

/* ソリューションページヘッダー（画像付き） */
.kochi-ai-solution-hero {
    position: relative !important;
    height: 350px !important;
    background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1600&h=400&fit=crop') !important;
    background-size: cover !important;
    background-position: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    color: #fff !important;
}

.kochi-ai-solution-hero::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(102,126,234,0.85) 0%, rgba(118,75,162,0.85) 100%) !important;
    z-index: 1 !important;
}

.kochi-ai-solution-hero-container {
    position: relative !important;
    z-index: 2 !important;
    max-width: 800px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

.kochi-ai-solution-label {
    display: inline-block !important;
    background: rgba(255,255,255,0.2) !important;
    padding: 8px 20px !important;
    border-radius: 30px !important;
    font-size: 14px !important;
    letter-spacing: 2px !important;
    margin-bottom: 20px !important;
    color: #fff !important;
}

.kochi-ai-solution-title {
    font-size: 42px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #fff !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3) !important;
}

.kochi-ai-solution-subtitle {
    font-size: 18px !important;
    opacity: 0.95 !important;
    line-height: 1.8 !important;
    color: #fff !important;
}

/* 既存のページヘッダーを画像ヘッダーに上書き（ソリューションページ用） */
body.page-id-91 .kochi-ai-page-header {
    position: relative !important;
    height: 350px !important;
    background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1600&h=400&fit=crop') !important;
    background-size: cover !important;
    background-position: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

body.page-id-91 .kochi-ai-page-header::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(102,126,234,0.85) 0%, rgba(118,75,162,0.85) 100%) !important;
    z-index: 1 !important;
}

body.page-id-91 .kochi-ai-page-header-container {
    position: relative !important;
    z-index: 2 !important;
}

body.page-id-91 .kochi-ai-page-title {
    font-size: 42px !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3) !important;
}

/* ソリューション項目 */
.kochi-ai-solutions {
    padding: 60px 20px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-solutions-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 40px !important;
}

.kochi-ai-solution-item {
    display: flex !important;
    gap: 30px !important;
    background: #fff !important;
    padding: 35px !important;
    border-radius: 15px !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
    align-items: flex-start !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.kochi-ai-solution-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12) !important;
}

.kochi-ai-solution-icon {
    flex-shrink: 0 !important;
    width: 80px !important;
    height: 80px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.kochi-ai-solution-icon i {
    font-size: 32px !important;
    color: #fff !important;
}

.kochi-ai-solution-content h3 {
    font-size: 22px !important;
    color: #1a365d !important;
    margin-bottom: 15px !important;
    font-weight: bold !important;
}

.kochi-ai-solution-content p {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    margin-bottom: 15px !important;
}

.kochi-ai-solution-content ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.kochi-ai-solution-content ul li {
    padding: 8px 0 !important;
    padding-left: 25px !important;
    position: relative !important;
    color: #4a5568 !important;
}

.kochi-ai-solution-content ul li::before {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    color: #667eea !important;
    font-weight: bold !important;
}

/* 導入の流れセクション */
.kochi-ai-process {
    background: #f8fafc !important;
    padding: 80px 20px !important;
}

.kochi-ai-process-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-process-steps {
    display: flex !important;
    justify-content: space-between !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
    margin-top: 40px !important;
}

.kochi-ai-process-step {
    flex: 1 !important;
    min-width: 200px !important;
    text-align: center !important;
    padding: 35px 20px !important;
    background: #fff !important;
    border-radius: 15px !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08) !important;
}

.kochi-ai-step-number {
    font-size: 42px !important;
    font-weight: bold !important;
    color: #667eea !important;
    margin-bottom: 15px !important;
}

.kochi-ai-process-step h4 {
    font-size: 18px !important;
    color: #1a365d !important;
    margin-bottom: 10px !important;
    font-weight: bold !important;
}

.kochi-ai-process-step p {
    color: #64748b !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* CTAセクション */
.kochi-ai-cta {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
}

.kochi-ai-cta-container {
    max-width: 600px !important;
    margin: 0 auto !important;
}

.kochi-ai-cta h2 {
    font-size: 28px !important;
    margin-bottom: 20px !important;
    font-weight: bold !important;
}

.kochi-ai-cta p {
    font-size: 16px !important;
    opacity: 0.9 !important;
    margin-bottom: 30px !important;
    line-height: 1.8 !important;
}

.kochi-ai-cta-btn {
    display: inline-block !important;
    background: #fff !important;
    color: #667eea !important;
    padding: 15px 40px !important;
    border-radius: 30px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.kochi-ai-cta-btn:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
    color: #667eea !important;
    text-decoration: none !important;
}

/* レスポンシブ */
@media screen and (max-width: 768px) {
    body.page-id-91 .kochi-ai-page-header,
    .kochi-ai-solution-hero {
        height: 280px !important;
    }

    body.page-id-91 .kochi-ai-page-title,
    .kochi-ai-solution-title {
        font-size: 28px !important;
    }

    .kochi-ai-solution-item {
        flex-direction: column !important;
        text-align: center !important;
    }

    .kochi-ai-solution-icon {
        margin: 0 auto !important;
    }

    .kochi-ai-process-steps {
        flex-direction: column !important;
    }
}

/* ================================================== */
/* 高知AI 全ページ完全スタイル */
/* ================================================== */

/* 共通ページヘッダー */
.kochi-ai-page-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    padding: 80px 20px !important;
    text-align: center !important;
    color: #fff !important;
    margin-bottom: 0 !important;
}

.kochi-ai-page-header-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-page-label {
    display: inline-block !important;
    background: rgba(255,255,255,0.2) !important;
    padding: 8px 20px !important;
    border-radius: 30px !important;
    font-size: 14px !important;
    letter-spacing: 2px !important;
    margin-bottom: 20px !important;
    color: #fff !important;
}

.kochi-ai-page-title {
    font-size: 36px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #fff !important;
}

.kochi-ai-page-subtitle {
    font-size: 16px !important;
    opacity: 0.9 !important;
    line-height: 1.8 !important;
    color: #fff !important;
}

/* ================================================== */
/* 導入事例ページ (case) */
/* ================================================== */

.kochi-ai-cases {
    padding: 60px 20px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-cases-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 40px !important;
}

.kochi-ai-case-item {
    display: flex !important;
    gap: 30px !important;
    background: #fff !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.kochi-ai-case-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12) !important;
}

.kochi-ai-case-image {
    flex: 0 0 300px !important;
    min-height: 250px !important;
}

.kochi-ai-case-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.kochi-ai-case-content {
    flex: 1 !important;
    padding: 30px !important;
}

.kochi-ai-case-category {
    display: inline-block !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    padding: 5px 15px !important;
    border-radius: 20px !important;
    font-size: 12px !important;
    margin-bottom: 15px !important;
}

.kochi-ai-case-title {
    font-size: 24px !important;
    color: #1a365d !important;
    margin-bottom: 15px !important;
    font-weight: bold !important;
}

.kochi-ai-case-description {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    margin-bottom: 20px !important;
}

.kochi-ai-case-results {
    display: flex !important;
    gap: 40px !important;
}

.kochi-ai-case-result {
    text-align: center !important;
}

.kochi-ai-result-number {
    display: block !important;
    font-size: 36px !important;
    font-weight: bold !important;
    color: #667eea !important;
}

.kochi-ai-result-label {
    font-size: 14px !important;
    color: #64748b !important;
}

/* ================================================== */
/* お問い合わせページ (contact) */
/* ================================================== */

.kochi-ai-contact-methods {
    padding: 60px 20px !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-contact-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-contact-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
}

.kochi-ai-contact-card {
    background: #fff !important;
    padding: 40px 30px !important;
    border-radius: 15px !important;
    text-align: center !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
}

.kochi-ai-contact-icon {
    width: 80px !important;
    height: 80px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
}

.kochi-ai-contact-icon i {
    font-size: 32px !important;
    color: #fff !important;
}

.kochi-ai-contact-card h3 {
    font-size: 18px !important;
    color: #1a365d !important;
    margin-bottom: 15px !important;
    font-weight: bold !important;
}

.kochi-ai-contact-number {
    font-size: 28px !important;
    font-weight: bold !important;
    color: #667eea !important;
    margin-bottom: 10px !important;
}

.kochi-ai-contact-email {
    font-size: 18px !important;
    color: #667eea !important;
    margin-bottom: 10px !important;
}

.kochi-ai-contact-hours,
.kochi-ai-contact-note {
    font-size: 14px !important;
    color: #64748b !important;
}

/* お問い合わせフォームセクション */
.kochi-ai-contact-form {
    padding: 60px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-contact-form-container {
    max-width: 700px !important;
    margin: 0 auto !important;
}

.kochi-ai-contact-form-note {
    text-align: center !important;
    color: #4a5568 !important;
    margin-bottom: 30px !important;
}

.kochi-ai-form-wrapper {
    background: #fff !important;
    padding: 40px !important;
    border-radius: 15px !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
}

/* お問い合わせ情報セクション */
.kochi-ai-contact-info {
    padding: 60px 20px !important;
}

.kochi-ai-contact-info-container {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-info-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
    margin-top: 30px !important;
}

.kochi-ai-info-item {
    display: flex !important;
    gap: 15px !important;
    align-items: flex-start !important;
}

.kochi-ai-info-item i {
    font-size: 24px !important;
    color: #667eea !important;
    margin-top: 5px !important;
}

.kochi-ai-info-item strong {
    display: block !important;
    color: #1a365d !important;
    margin-bottom: 5px !important;
    font-weight: bold !important;
}

.kochi-ai-info-item p {
    color: #4a5568 !important;
    margin: 0 !important;
    line-height: 1.6 !important;
}

/* ================================================== */
/* 会社概要ページ (company) */
/* ================================================== */

.kochi-ai-company-info {
    padding: 60px 20px !important;
    max-width: 900px !important;
    margin: 0 auto !important;
}

.kochi-ai-company-container {
    background: #fff !important;
    padding: 40px !important;
    border-radius: 15px !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
}

.kochi-ai-company-table table {
    width: 100% !important;
    border-collapse: collapse !important;
}

.kochi-ai-company-table th,
.kochi-ai-company-table td {
    padding: 20px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    text-align: left !important;
}

.kochi-ai-company-table th {
    width: 30% !important;
    background: #f8fafc !important;
    font-weight: bold !important;
    color: #1a365d !important;
}

.kochi-ai-company-table td {
    color: #4a5568 !important;
}

.kochi-ai-company-table ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.kochi-ai-company-table ul li {
    padding: 5px 0 !important;
    position: relative !important;
    padding-left: 20px !important;
}

.kochi-ai-company-table ul li::before {
    content: '・' !important;
    position: absolute !important;
    left: 0 !important;
    color: #667eea !important;
}

/* アクセスセクション */
.kochi-ai-access {
    padding: 60px 20px !important;
    background: #f8fafc !important;
}

.kochi-ai-access-container {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

.kochi-ai-access-content {
    display: flex !important;
    gap: 40px !important;
    flex-wrap: wrap !important;
    margin-top: 30px !important;
}

.kochi-ai-access-map {
    flex: 1 !important;
    min-width: 300px !important;
}

.kochi-ai-access-map iframe {
    border-radius: 15px !important;
}

.kochi-ai-access-info {
    flex: 1 !important;
    min-width: 300px !important;
    background: #fff !important;
    padding: 30px !important;
    border-radius: 15px !important;
}

.kochi-ai-access-info h3 {
    font-size: 20px !important;
    margin-bottom: 20px !important;
    color: #1a365d !important;
    font-weight: bold !important;
}

.kochi-ai-access-info ul {
    list-style: none !important;
    padding: 0 !important;
}

.kochi-ai-access-info ul li {
    padding: 15px 0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    color: #4a5568 !important;
    line-height: 1.6 !important;
}

.kochi-ai-access-info ul li:last-child {
    border-bottom: none !important;
}

.kochi-ai-access-info ul li strong {
    color: #1a365d !important;
}

/* ================================================== */
/* よくある質問ページ (faq) */
/* ================================================== */

.kochi-ai-faq-content {
    padding: 60px 20px !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

.kochi-ai-faq-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.kochi-ai-faq-container .kochi-ai-section-title {
    margin-top: 40px !important;
}

.kochi-ai-faq-container .kochi-ai-section-title:first-child {
    margin-top: 0 !important;
}

.kochi-ai-faq-item {
    background: #fff !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 3px 15px rgba(0,0,0,0.06) !important;
}

.kochi-ai-faq-question {
    padding: 20px 25px !important;
    background: #f8fafc !important;
    cursor: pointer !important;
    transition: background 0.3s !important;
}

.kochi-ai-faq-question:hover {
    background: #e8f0fe !important;
}

.kochi-ai-faq-question h3 {
    font-size: 16px !important;
    color: #1a365d !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-weight: bold !important;
}

.kochi-ai-faq-question i {
    color: #667eea !important;
}

.kochi-ai-faq-answer {
    padding: 20px 25px !important;
    border-top: 1px solid #e2e8f0 !important;
}

.kochi-ai-faq-answer p {
    color: #4a5568 !important;
    line-height: 1.8 !important;
    margin: 0 !important;
}

/* ================================================== */
/* レスポンシブ対応 */
/* ================================================== */

@media screen and (max-width: 768px) {
    .kochi-ai-page-header {
        padding: 60px 15px !important;
    }

    .kochi-ai-page-title {
        font-size: 28px !important;
    }

    .kochi-ai-case-item {
        flex-direction: column !important;
    }

    .kochi-ai-case-image {
        flex: none !important;
        height: 200px !important;
    }

    .kochi-ai-case-results {
        justify-content: center !important;
    }

    .kochi-ai-contact-grid,
    .kochi-ai-info-grid {
        grid-template-columns: 1fr !important;
    }

    .kochi-ai-company-table th,
    .kochi-ai-company-table td {
        display: block !important;
        width: 100% !important;
    }

    .kochi-ai-company-table th {
        border-bottom: none !important;
        padding-bottom: 5px !important;
    }

    .kochi-ai-company-table td {
        padding-top: 5px !important;
    }

    .kochi-ai-access-content {
        flex-direction: column !important;
    }
}
