/*========================================================*/
/*-------擐����批捆--------*/
/*========================================================*/









/*/////////////////////////////////////////////////////////*/
/*-------�梁�典��憛�--------*/
/*/////////////////////////////////////////////////////////*/


/*擐����批捆��憛�*/	
/* .mainContent{
	padding: 50px 0px;
} */



	/*----- 擐���璅�憿�1 -----*/
	.index_title {
		font-size: 30px;
		font-weight: bold;
		color: #777;
		line-height: 1.3;
		text-align: center;
		margin-bottom: 20px;
	}	
		.index_title h2{	
			font-size: inherit;
			line-height: initial;
			padding: 0;
			margin: 0;
			display: inline-block;
			font-weight: inherit;
		}	







@media (max-width: 990px){
	
	.mainContent{	
		padding: 25px 0 0 0;	
	}	



		/*----- 擐���璅�憿�1 -----*/
		.index_title{
			font-size: 25px;
			line-height: 1.2;
		}

}


/*/////////////////////////////////////////////////////////*/
/*-------擐��� ���啁�Ｗ�� ��憛�--------*/
/*/////////////////////////////////////////////////////////*/

.index_productBg{
    padding-top: clamp( 1.25rem, 5.3333vw, 2.5rem );
}

.product_center{
    padding-bottom: 2.5rem;
}

/* ���啁�Ｗ��銝餅���憛�----------------- */

.latest_products{
    font-size: 2rem;/*32*/
    font-weight: bold;
    line-height: 1.2;
    letter-spacing: 1px;
    padding: 2.5rem 0;
    display: flex;
    justify-content: center;
}

.latest_products h2{
    display: block;
    font-size: inherit;
    font-weight: inherit;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    display: flex;
    gap: .625rem;/*10*/
    align-items: center;
}

.latest_products h2::before,
.latest_products h2::after{
    content: "";
    background-repeat: no-repeat;
    background-position: center;
    background-size: 99.9%;
    aspect-ratio: 30 / 25;
    width: clamp(1.875rem, 8vw, 3.75rem);
    height: auto;
    display: block;
}

.latest_products h2::before{
    background-image: url(../index/images/title_wave.svg);
}

.latest_products h2::after{
    background-image: url(../index/images/title_wave.svg);
}

/* �����∠����憛�----------------- */

.product_list_area {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(1.25rem, 5.3333vw, 2.5rem); /* �芷�拇����頝� */
}

.product_list_area .product_list {
    width: calc(25% - (3/4 * clamp(1.25rem, 5.3333vw, 2.5rem)));
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.product_list_area .product_list:hover {
    transform: translateY(-10px);
}

.index_product_img{

}

.index_product_img a{
    display: block;
    position: relative;
    padding-top: 100%;
}

.index_product_img a img{
    width:100%;
    height:auto;
    transition: all 0.3s ease-out;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    float: none;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    transition: all 0.3s ease-out;
    border-radius: 50%;
    border: 2px solid #505050;
    transition: opacity 0.5s ease-out;
}

.index_product_img a .img01 {
    opacity: 1;
    z-index: 1;
}

.index_product_img a .img02{
    opacity: 0;
    z-index: 2;
}

/* 皛��交���� */
.index_product_img a:hover img {
    border: 3px solid var(--second_color);
}

.index_product_img a:hover .img01 {
    opacity: 0;
}

.index_product_img a:hover .img02 {
    opacity: 1;
}

.product_title{
    height: 100%;
    min-height: 3.75rem; /* 60 */
    display: flex;
    align-items: center;
    justify-content: center;
}

.product_title a {
    color: var(--primary_color);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 30px;
    text-decoration: none;

    overflow: hidden;
    text-overflow: ellipsis; /* 頞��箄��訾誑...�蹂誨 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2 ; /* ���嗉��� */
    box-sizing:border-box;
}

.product_text {
    font-size: .875rem;
    line-height: 1.8;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    min-height: 4.6875rem; /* 75 */
}

/* ������憛�----------------- */

.product_more{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 1.25rem;
}

.product_more .btn_more_product{
    border: none;
    background-color: var(--primary_color);
    border-radius: .3125rem;
    color: var(--white_color);
    cursor: pointer;
    padding: .625rem 2.5rem;
    transition: all 0.3s ease;
}

.product_more .btn_more_product:hover{
    opacity: 0.8;
    transform: translateY(5px);
}

@media(max-width:990px) {
    .product_list_area .product_list {
        width: calc(50% - (1/2 * clamp(1.25rem, 5.3333vw, 2.5rem)));
    }
}

@media (max-width: 540px) {
    .product_list_area .product_list {
        width: 100%;
    }
}

/*/////////////////////////////////////////////////////////*/
/*-------擐��� ���唳��� ��憛�--------*/
/*/////////////////////////////////////////////////////////*/

.index_newsBg{
    /* padding-top: clamp( 1.25rem, 5.3333vw, 2.5rem );
    position: relative;
    width: 100%;
    min-height: 100vh;
    max-height: 100%;
    background-image: url(../index/images/bg1.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: flex-end;
    align-items: center; */
}

.index_newsBg .wrap{
    /* margin: 0;
    max-width: calc(100% - 6.25rem);
    padding: clamp(2.0968rem, 3.3854vw, 4.0625rem) 0; */
}

.index_newslist_content{
    /* justify-content: space-around;
    align-items: flex-start;
    background-color: #fff;
    width: 100%;
    border-radius: 10px 0 0 10px;
    padding: clamp(4.8389rem, 7.8125vw, 9.3750rem) 0;
    padding-left: clamp(0.6452rem, 1.0417vw, 1.2500rem);
    padding-right: clamp(0.6452rem, 1.0417vw, 1.2500rem);
    column-gap: .9375rem;
    display: grid;
    grid-template-columns: clamp(16.1296rem, 26.0417vw, 31.2500rem) auto; */
}

.list_area {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.list_area .list_item {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    gap: 10px;
    padding-bottom: clamp(0.9678rem, 1.5625vw, 1.8750rem);
    padding-top: clamp(0.9678rem, 1.5625vw, 1.8750rem);
    border-bottom: 2px dotted #ccc;
}

.list_area .list_item:first-of-type {
    padding-top: 0;
}

.list_area .list_item .list_item_left {
    flex: 1;
}

.list_area .list_item .list_item_left .list_img {
    width: 200px;
}

.list_area .list_item .list_item_left .list_img a {
    position: relative;
    display: block;
    /* padding-top: 66.7%; */
    padding-top: 73.2%;
}

.list_area .list_item .list_img a img {
    width: 100%;
    height: auto;
    transition: all 0.3s ease-out;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    float: none;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    transition: all 0.3s ease-out;
}

.list_area .list_item .list_item_right {
    width: calc(100% - 200px);
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.list_area .list_item .list_top {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 15px;
}

.list_area .list_item .list_top .tag {
    padding: 2px 10px;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 500;
    color: #fff;
    /* background-color: var(--second_color); */
    background-color: var(--primary_color);
    border-radius: 13px;
    /* margin-right: 10px; */
    font-family: var(--foreign_font);
}

.list_area .list_item .list_top .date_range {
    display: flex;
    flex-direction: row;
    gap: 5px;
    margin-bottom: 0;
    font-size: 1rem;
    line-height: 1.1;
    color: #474843;
    font-family: var(--foreign_font);
}

.date_range .start_date {
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    font-family: inherit;
}

.list_area .list_item .list_item_bottom .list_item_title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: clamp(48.3887rem, 78.1250vw, 93.7500rem);
}

.list_area .list_item .list_item_bottom .list_item_title a {
    font-size: 1rem;
    display: block;
    text-decoration: none;
    line-height: 1.5;
    color: #474843;
    margin-bottom: 0;
}


@media (max-width: 540px) {
    .list_area .list_item {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        flex: 1;
        gap: 10px;
        padding-bottom: 30px;
        padding-top: 30px;
        border-bottom: 1px solid #ccc;
        width: 100%;
    }
    .list_area .list_item .list_item_left {
        width: 100%;
        flex: 1;
    }
    .list_area .list_item .list_item_left .list_img {
        width: 100%;
    }
    .list_area .list_item .list_item_right {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
}


/*--------------------------------��蝞望����--------------------------------*/
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are

    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{margin-top:20px;background:#000;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{border:5px solid #000; background:#000;}
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc; font-family: 'BenchNine', sans-serif;}  /*���豢見撘�*/
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover{background-position:bottom right;}
        #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(images/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose:hover{background-position:bottom center;}


/*/////////////////////////////////////////////////////////*/
/*-------擐��� ������鈭� ��憛�--------*/
/*/////////////////////////////////////////////////////////*/

.index_aboutBg {
    padding-top: 35px;
}

.text_block{
    width: 100%;
    aspect-ratio: 16 / 9;
    /* aspect-ratio: 16 / 8; */
    background-image: url(../index/images/paper_bg.webp);
    background-position: center;
    background-size: cover;
    padding-left: clamp( 1.25rem, 5.3333vw, 2.5rem ) ;
    padding-right: clamp( 1.25rem, 5.3333vw, 2.5rem ) ;
    max-width: 990px;
    margin: 0 auto;
    display: flex;
    flex-direction: row-reverse;
    gap: clamp( 1.25rem, 5.3333vw, 2.5rem );
    /* justify-content: center; */
    position: relative;
}

.index_aboutBg {
    position: relative;
    padding-bottom: 35px;
    background: url(../index/images/sea_bg.webp)center center no-repeat fixed #000000;
    background-size: cover;
}

.text_block::after{
    content: "";
    background-image: url(../index/images/gyotaku.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 99.9%;
    display: block;

    /* 撠箏站閮剖�--------------------------- */
    aspect-ratio: 30 / 30;
    width: clamp(7.8125rem, 33.3333vw, 15.625rem ); /* 125 250 */
    height: auto;

    /* ����閮剖�--------------------------- */
    opacity: 0.8;
    mix-blend-mode: multiply; /* �脣蔗憓��� */

    /* 摰�雿�閮剖�--------------------------- */
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate(15%, -10%);
}

.container {
    padding: clamp( 1.25rem, 6vw, 2.8125rem );
}

.container_title{
	color: var(--black_color);
	font-size: 2rem;/*32*/
	text-align: center;
	line-height: 1.2;
	letter-spacing: 1px;
	font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
}

.index_serviceBg .title {
	padding: 43px 0px 25px;
    font-size: 27px;
    letter-spacing: 5px;
    text-align: center;
    line-height: 1.2;
    margin: 0 0 40px;
	font-weight:bold
}

.container_title h2 {
    display: block;
    font-size: inherit;
    font-weight: inherit;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    writing-mode: vertical-rl;
}

.index_aboutBg .editor {
    box-sizing: border-box;
    font-size: 1rem;
    font-weight: 600;
    line-height: 2;
    position: unset;
    padding-top: clamp( 1.5625rem, 6.6667vw, 3.125rem ) ;
    padding-bottom: clamp( 1.5625rem, 6.6667vw, 3.125rem ) ;
    writing-mode: vertical-rl;
    width: 100%;

    max-width: 830px;
    overflow: hidden;
    text-overflow: ellipsis; /* 頞��箄��訾誑...�蹂誨 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    box-sizing:border-box;

}


@media screen and (max-width: 1000px){

	.container_title {
		padding: 24px;
	}

	.index_aboutBg {
		/* background-attachment: inherit; */
	}

	.index_aboutBg .title {
		text-align: center;
		/* padding: 0; */
		text-indent: 0;
		padding-bottom: 20px;
		padding: 10px 0;
		margin:0px;
	}

	.index_aboutBg .title h2 {
		color: #fff;
		padding: 3px 0;
	}

	.index_aboutBg .editor {
		border: none;
		width: 100%;
    	float: none;
	}

	.text_content {
		max-width: 100%;
	}

    .text_block::after{
        opacity: 0.2;
    }

}

@media (max-width: 990px){

    .container {
        padding-top: clamp( .625rem, 2vw, .9375rem );
        padding-bottom: clamp( .625rem, 2vw, .9375rem );
        padding-left: clamp( .9375rem, 4vw, 1.875rem );
        padding-right: clamp( .9375rem, 4vw, 1.875rem );
    }

    .container_title {
        padding-bottom: 0;
    }

    .text_block{
        display: block;
        padding-bottom: 14px;
        aspect-ratio: unset;
    }

    .container_title h2 {
        writing-mode: horizontal-tb;
    }

    .index_aboutBg .editor {
        writing-mode: unset;
        font-size: .875rem;
        margin: 0 auto;
        max-height: 600px;
        overflow-y: auto;
    }
}

@media (max-width: 640px){
    .index_aboutBg .editor {
        padding-top: clamp( .625rem, 2.6667vw, 1.25rem ) ;
        padding-bottom: clamp( .625rem, 2.6667vw, 1.25rem ) ;
        padding-left: clamp( .625rem, 2.6667vw, 1.25rem ) ;
        padding-right: clamp( .625rem, 2.6667vw, 1.25rem ) ;
    }

        .index_aboutBg .editor {
        font-size: .75rem;
    }
}


/*/////////////////////////////////////////////////////////*/
/*-------擐��� �舐窗���� ��憛�--------*/
/*/////////////////////////////////////////////////////////*/

.index_contactBg{
    padding-bottom: clamp( 1.25rem, 5.3333vw, 2.5rem );
}

.index_contact_area{
    display: flex;
    /* grid-template-columns: repeat(2, 1fr); */
    gap: clamp( 1.25rem, 5.3333vw, 2.5rem );
}

.contact_area_left,
.contact_area_right{
    width: 100%;
}

.form_area{
    display: block;
}

.form_list_group{
    display: flex;
    gap: clamp( .625rem, 2.6667vw, 1.25rem );
}

.form_list .fL_info select{
    width: 100%;
}

.expository_text{
    padding-bottom: 2.5rem;
}

.agreeToTerms {
    display: flex;
    flex-direction: column;
    gap: 0.9375rem;
    color: var(--dark_color);
    font-size: inherit;
    font-weight: inherit;
    font-size: 0.9375rem;
    margin-top: clamp(1.6130rem, 2.6042vw, 3.1250rem);
}

.index_contact_area .agreeToTerms {
    max-width: 82.5rem;
    margin-left: auto;
    margin-right: auto;
    /* padding-left: clamp(0.7500rem, 1.2500vw, 1.5000rem); */
}

.agreeToTerms_item {
    color: inherit;
}

.agreeToTerms a {
    color: var(--primary_color);
    font-weight: bold;
    text-decoration: none;
}

.item_RadioCheckArea {
    display: inline-flex;
    align-items: first baseline;
    flex-wrap: wrap;
    /* gap: 12px 15px; */
    gap: clamp(.625rem, 1.6vw, .75rem) clamp(.625rem, 2vw, .9375rem);
    padding-left: 0;
}

.agreeToTerms label {
    font-size: inherit;
    font-weight: inherit;
    display: flex;
    align-items: unset;
    gap: .3125rem;
}

.item_RadioCheckArea .item_Check_list {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    /* gap: 7px; */
    gap: .125rem;
    flex-direction: row;
}

.btn_area input {
    color: var(--white_color);
}

.btn_area {
    margin: 30px 0px;
}

@media (max-width: 990px){

    .index_contact_area{
        flex-direction: column-reverse;
    }

}

@media (max-width: 550px){

    .form_list_group{
        display: block;
    }

}

/* 甈脰頃鞎琿�詨��--------------- */

    .product_options_area{
		/* margin-bottom: clamp( .7813rem, 3.3333vw, 1.5625rem); */
    }

        .product_options_area .form_area{
            row-gap: clamp(0.8065rem, 1.3021vw, 1.5625rem); /* 12.90px , 1.3021vw , 25.00px */
        }

            .product_options_area .fL_tit{
                /* cursor: pointer; */
            }

             .product_options_area .fL_tit:hover{
                /* opacity: 0.7; */
            }

                .product_options_area .fL_tit i{
                    color: inherit;  
                    font-size: inherit;  
                }

				/* 20250806��閮剝�詨�桀�券�冽���� */
                .product_options_area .fL_info{
                    display: flex;
                    border-radius: .625rem; /*10*/
                    padding:clamp(0.8065rem, 1.3021vw, 1.5625rem); /* 12.90px , 1.3021vw , 25.00px */
                    box-shadow: rgb(0 0 0 / 25%) 0px 0px 5px;
                }

                /* 蝚砌����詨�桀�箏����� */
                /* .form_area .form_list:nth-child(1) .fL_info{
                    display: flex;
                } */

                .check-text{
                    font-size: clamp( .75rem, 2vw, .9375rem );
                }

@media (max-width: 990px){

     .product_options_area .item_RadioCheckArea {
        flex-direction: row;
    }

}