@charset "utf-8";

/*	tablet size
*********************************************************************************************************************************/
@media screen and (max-width: 1059px) {	
	/******************************************************************************************
		共通エフェクト
	******************************************************************************************/
	/*マウスストーカー*/
	#stalker {
		display: none;
	}
	
	/******************************************************************************************
		ヘッダー
	******************************************************************************************/
	#header_wrap header{
		justify-content: space-between;
	}
	#header_wrap header #header_logo{
		width: 190px;
	}
	#header_wrap header #header_nav{
		display: none;
	}
	#header_wrap header #toggle{
		width: 40px;
		height: 40px;
	}
	
	/*開閉メニューデザイン*/
	#g_nav .gnav_menu ul li{
		width: 50%;
		margin-bottom: 20px;
	}
	#g_nav .gnav_menu ul li.top{
		width: 100%;
	}
	#g_nav .gnav_menu ul li a{
		padding: 5px 10px;
	}
	#g_nav .gnav_menu ul li ul.sub{
		margin-top: 10px;
	}
	
	#g_nav .gnav_menu ul li ul.sub li a{
		padding: 5px 10px;
	}
	#g_nav .contact_area{
		margin-top: 20px;
		display: block;
		padding: 0 10px;
	}
	#g_nav .contact_area .contact_box{
		width: 100%;
		margin: 10px 0;
		padding: 15px 15px;
	}
	#g_nav .contact_area .contact_box .logo{
		width: 50px;
		margin-right: 20px;
	}
	#g_nav .contact_area .contact_box .name span{
		display: block;
	}
	#g_nav .contact_area .contact_box .tel .number{
		font-size: var(--18px);
		background-size: auto 20px;
		padding-left: 22px;
	}
		
	/******************************************************************************************
		お問い合わせ
	******************************************************************************************/
	#contact_wrap{
		padding: 40px 0;
	}
	#contact_wrap .text{
		font-size: var(--13px);
		margin:-10px 0 30px 0;
		padding: 0 15px;
	}
	
	#contact_wrap .contact_area{
		display: block;
	}
	#contact_wrap .contact_area .contact_box{
		width: 100%;
		margin: 10px 0;
		padding: 15px 15px;
	}
	#contact_wrap .contact_area .contact_box .logo{
		width: 50px;
		margin-right: 20px;
	}
	#contact_wrap .contact_area .contact_box .name{
		flex: 1;
		font-size: var(--16px);
		font-weight: 700;
	}
	#contact_wrap .contact_area .contact_box .name span{
		display: block;
	}
	#contact_wrap .contact_area .contact_box .tel .number{
		font-size: var(--18px);
		background-size: auto 20px;
		padding-left: 22px;
	}
	#contact_wrap .contact_area .contact_box .tel .note{
		font-size: var(--12px);
		font-weight: 400;
	}
	#contact_wrap .contact_area .contact_box .form{
		margin-top: 10px;
		text-align: left;
	}
	#contact_wrap .contact_area .contact_box .form .btn{
		padding: 4px 30px;
	}
	
	
	/******************************************************************************************
		フッター
	******************************************************************************************/
	#footer_wrap{
		padding: 40px 0;
	}
	#footer_wrap footer{
		align-items: center;
	}
	#footer_wrap footer .footer_info{
		width: auto;
		padding: 0;
		border-right:none;
	}
	#footer_wrap footer .footer_info .logo{
		width: 180px;
		margin-bottom: 20px;
	}
	#footer_wrap footer .footer_info .info{
		color: #404040;
		font-size: var(--12px);
		line-height: 1.7;
	}
	#footer_wrap footer .footer_info .note{
		display: inline-block;
		background: #6D6D6D;
		border-radius: 3px;
		color: #FFFFFF;
		letter-spacing: 0.1em;
		padding: 0 10px;
	}
	#footer_wrap footer .footer_info .certification{
		margin-top: 20px;
		width: 240px;
	}
	#footer_wrap footer .footer_info .copyright{
		color: #777777;
		font-size: var(--10px);
		margin-top: 25px;
	}

	#footer_wrap footer .footer_menu{
		display: none;
	}

	/******************************************************************************************
		共通スタイル
	******************************************************************************************/
	main{
		padding-bottom: 50px;
	}
	article + article{
		margin-top: 60px;
	}
	section{
		padding: 0 10px;
		font-size: var(--15px);
	}
	section + section{
		margin-top: 50px;
	}
	
	article.article_l{
		padding: 40px 20px;
	}
	
	/*パンくず*/
	.breadcrumb{
		padding-top: 10px;
		margin-bottom: 40px;
		font-size: var(--11px);
	}
	.breadcrumb ul{
		flex-wrap: wrap;
	}
	
	/*見出し*/
	h1 {
		margin-bottom: 40px;
		padding-bottom: 20px;
	}
	h1 p.category{
		font-size: var(--13px);
		margin-bottom: 15px;
	}
	h1 p:not(.category){
		font-size: var(--30px);
	}
	h1 .dots {
		position: absolute;
		bottom: 0;
		width: 8px;
		height: 8px;
		border-radius: 50%;
		opacity: 0;
		animation: dotAppear 0.6s ease-out forwards;
	}
	
	h2{
		font-size: var(--20px);
		margin-bottom: 25px;
	}
	h3{
		font-size: var(--18px);
		margin-bottom: 10px;
	}
	
	/******************************************************************************************
		デザインパーツ
	******************************************************************************************/
	/*白ボタン*/
	.btn{
		padding: 10px 35px 10px 20px;
	}
	
	/*カラーボタン*/
	.btn_big{
		padding:10px 30px;
		min-width: 250px;
	}
	
	/*テーブル*/
	.table_style01 th{
		display: block;
		width: 100%;
		padding: 15px 15px 5px 15px;
	}
	.table_style01 td{
		display: block;
		width: 100%;
		padding: 0 15px 15px 15px;
		border-top: none;
	}
	.table_style01 th:last-of-type,
	.table_style01 td:last-of-type {
		border-bottom: none;
	}
	.table_style01 tr:last-child td{
		border-bottom: 1px solid #E4E4E4;
	}
	
	/*背景付ボックス*/
	.box_gray{
		background: var(--color-bg-gray);
		padding: 20px 20px;
		border: 1px solid #E4E4E4;
	}

	/*2列*/
	.box02{
		display: block;
	}
	.box02 .box{
		width: 100%;
		margin: 0;
	}
	.box02 .box:nth-child(n+2) {
		margin-top: 20px;
	}
	
	/*写真+テキスト*/
	.photoarea_l{
		display: block;
	}
	.photoarea_l .photo{
		width: 100%;
		min-width: auto;
		margin-right: 0;
		margin-bottom: 30px;
		text-align: center;
	}
	.photoarea_l .text{
		width: 100%;
	}
	
	
	/******************************************************************************************
		TOPページ
	******************************************************************************************/
	#top_main #top_main_box{
		flex-direction: column;
	}
	#top_main .top_main_txt{
		text-align: center;
		line-height: 2.0;
	}
	#top_main .top_main_logo{
		width: 280px;
		height: 280px;
		margin: 0 auto 20px auto;
	}
	#top_main #top_main_box.loaded .top_main_txt{
		font-size: var(--26px);
	}
	
	/*TOP用見出し*/
	h2.h2_top{
		font-size: var(--13px);
		margin-bottom: 30px;
		margin-top: 0;
	}
	h2.h2_top span.en{
		font-size: var(--50px);
		top: 10px;
	}

	/*お知らせ*/
	#top_news{
		padding: 40px 0;
	}
	.top_news_list{
		justify-content: space-around;
		flex-wrap: wrap;
	}
	.top_news_list li{
		width: calc(50% - 20px);
		max-width: calc(50% - 20px);
	}
	.top_news_list li a{
		max-width: 300px;
		margin: 0 auto;
	}
	.top_news_list li:nth-child(2){
		margin-top: -20px;	
	}
	.top_news_list li:nth-child(3){
		margin-top: 20px;
	}
	.top_news_list li:nth-child(4){
		margin-top: 0;
	}
	.top_news_more{
		margin-top: 10px;
	}
	
	/*企業概要*/
	#top_about{
		background: url("../img/top/about_bg.png") no-repeat rgba(255, 255, 255, 0.85);
		background-blend-mode: lighten;
		background-position: center bottom -5vw;
		background-size: 100% auto;
		padding: 80px 0 0 0;
		position: relative;
	}
	#top_about .scroll-infinity{
		height: 60px;
		z-index: 1;
	}
	#top_about .scroll-infinity__list {
		margin-top:-10px;
	}
	#top_about .scroll-infinity__item {
		min-width: 800px;
	}
	#top_about .scroll-infinity__item > img {
		padding: 0 15px;
	}
	#top_about .wrapper_1300{
		background: none;
	}
	#top_about .top_about_text{
		width: 100%;
		min-width: auto;
		float: none;
		margin-inline: auto;
    	max-inline-size: max-content;
		padding: 0 20px 50px 20px;
	}
	#top_about .top_about_text{
		font-size: var(--14px);
	}
	#top_about .top_about_text p + p{
		margin-top: 20px;
	}
	#top_about .top_about_text .txt-copy{
		font-size: var(--20px);
	}
	
	/*写真横スクロール*/
	#top_marquee{
		padding: 100px 0;
	}
	.top_marquee_bg{
		top: 40px;
	}
	.top_marquee_main ul, .top_marquee_bg ul{
		animation: top_marquee_main 140s linear infinite;
	}
	.top_marquee_bg ul{
		animation: top_marquee_main 180s linear infinite;
		padding: 20px 0;
	}
	.top_marquee_main ul li, .top_marquee_bg ul li{
		padding: 0 15px;
		width: 250px;
	}
	.top_marquee_main ul li:nth-child(2n){
		margin-top: 50px;
	}
	.top_marquee_bg ul li:nth-child(2n-1){
		margin-top: 200px;
	}	
	
	/*サービス*/
	#top_works{
		padding: 40px 0;
	}
	#top_works .top_works_link_dp{
		margin-bottom: 30px;
	}
	#top_works .top_works_link_dp a{
		padding: 15px 20px;
		flex-wrap: wrap;
		position: relative;
	}
	#top_works .top_works_link_dp a .image{
		width: 60px;
		z-index: 1;
	}
	#top_works .top_works_link_dp a .title{
		display: block;
		padding: 0 30px;
		font-size: var(--16px);
		z-index: 1;
	}
	#top_works .top_works_link_dp a .en{
		position: absolute;
		right: 30px;
		font-size: var(--18px);
	}
	
	#top_works .top_works_link_list{
		flex-wrap: wrap;
	}
	#top_works .top_works_link_list a{
		width: calc(50% - 20px);
		padding: 5px;
	}
	#top_works .top_works_link_list a:nth-child(3){
		margin-top: 15px;
	}
	#top_works .top_works_link_list a .image{
		height: 130px;
	}
	#top_works .top_works_link_list a .image img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#top_works .top_works_link_list a .text{
		width: calc(100% - 25px);
		height: 80px;
		padding: 5px 15px;
	}
	#top_works .top_works_link_list a .en{
		font-size: var(--18px);
		margin-bottom: 0;
	}
	#top_works .top_works_link_list a .title{
		font-size: var(--16px);
	}
	
	/*データパブリッシング用モーダル*/
	.modal-content {
		padding: 15px;
	}

	.dp_modal_title{
		height: auto;
		font-size: var(--18px);
		line-height: 1.4;
		padding: 5px 15px 10px 15px;
		margin-bottom: 15px;
	}
	.dp_modal_title span{
		display: block;
		font-size: var(--13px);
	}
	.dp_modal_container{
		display: block;
		padding: 15px 20px;
		height: calc(100% - 85px);
	}
	.dp_modal_container .image{
		position: static;
		left: 0;
		top:0;
		width: 100%;
		margin-bottom: 30px;
	}
	.dp_modal_container .image .image_wrap{
		width: 90%;
		max-width: 360px;
		margin: 0 auto;
	}
	.dp_modal_container .image .image_wrap p:nth-child(n+2) {
		position: absolute;
		left: 0;
		top: 0;
	}
	.dp_modal_container .text{
		width: 100%;
		padding-left: 0;
		font-size: var(--15px);
		line-height: 2.0;
	}
	
	
	/******************************************************************************************
		下層ページメニュー
	******************************************************************************************/
	.category_menu ul li{
		width: calc(50% - 20px);
		margin: 0 10px;
	}
	.category_menu ul li:nth-child(n+3) {
		margin-top: 40px;
	}
	.category_menu ul li .image{
		margin-bottom: 15px;
	}
	.category_menu ul li .text .title{
		font-size: var(--16px);
		margin-bottom: 10px;
	}
	.category_menu ul li .text .note{
		font-size: var(--12px);
	}
	
	/******************************************************************************************
		企業情報
	******************************************************************************************/
	/*企業概要*/
	.company_profile .logo {
		width: 20%;
		min-width: 100px;
		margin-right: 20px;
		padding-top: 15px;
	}
	.company_profile .text .info{
		padding: 0 15px;
	}
	.company_profile .text dl{
		display: block;
	}
	.company_profile .text dl dt {
		width: 100%;
		padding: 15px 15px 5px 15px;
	}
	.company_profile .text dl dd {
		width: 100%;
		padding: 0 15px 15px 15px;
		border-top: none;
	}
	.company_profile .text dl dt:last-of-type {
		border-bottom: none;
	}
	
	/*沿革*/
	.history_timeline .image{
		width: 35%;
		margin-right: 20px;
		flex-wrap: wrap;
	}
	.history_timeline .image .photo{
		width: 100%;
		text-align: center;
		max-width: 100%;
		order: 0;
	}
	.history_timeline .image .photo img{
		width: 80%;
		max-width: 200px;
	}
	.history_timeline .image .note{
		width: 100%;
		order: 1;
		font-size: var(--11px);
		padding:0;
		margin-top: 15px;
	}

	.history_photoarea {
		margin-top: 80px;
	}
	.history_photoarea .scroll-infinity__item {
		min-width: 1600px;
	}
	
	/*社長ご挨拶*/
	.message_ceo{
		background: none;
		padding: 0;
	}
	.message_ceo .image_sp{
		display: block;
		margin-bottom: 30px;
		text-align: center;
	}
	.message_ceo .image_sp img{
		width: 100%;
		max-width: 600px;
	}
	.message_ceo .sign{
		width: 170px;
	}
	
	/*企業理念*/
	.message_philosophy{
		font-size: var(--30px);
		margin-bottom: 30px;
	}
	.message_vision{
		margin-bottom: 40px;
	}
	
	/*取り組み*/
	.action_photoarea{
		display: block;
	}
	.action_photoarea .photo{
		width: 100%;
		margin-right: 0;
		position: static;
		top: 0;
	}
	.action_photoarea .photo p{
		width: 80%;
		max-width: 300px;
		margin:0 auto 30px auto;
	}
	.action_photoarea .text{
		flex: 1;
	}
	
	/******************************************************************************************
		新着情報
	******************************************************************************************/
	dl.newslist{
		display: block;
	}
	dl.newslist dt {
		width: 100%;
		padding: 15px 15px 5px 15px;
	}
	dl.newslist dd {
		width: 100%;
		padding: 0 15px 15px 15px;
		border-top: none;
	}
	dl.newslist dt:last-of-type {
		border-bottom: none;
	}
	
	/*ニュース記事*/
	.news_title{
		padding: 0 5px 20px 5px;
	}
	.news_title .title{
		font-size: var(--18px);
		margin-bottom: 5px;
	}
	.news_title .date{
		font-size: var(--13px);
	}
	.news_body{
		padding: 0 5px;
	}
	
	/******************************************************************************************
		採用情報
	******************************************************************************************/
	.btn_entry{
		font-size: var(--16px);
		letter-spacing: 0.01em;
	}
	
	/******************************************************************************************
		お問い合わせ
	******************************************************************************************/
	.contact_form{
		margin: 10px auto;
	}
	.contact_form dl{
		margin-bottom: 30px;
	}
	.contact_form button{
		padding:12px 20px;
		min-width: 100%;
		letter-spacing: 0.05em;
		font-size: var(--14px);
	}
	
	
	/******************************************************************************************
		事業内容
	******************************************************************************************/
	[class^="service_menu_"] a .image{
		margin-bottom: 15px;
	}
	[class^="service_menu_"] a .text{
		padding: 0 5px;
	}
	[class^="service_menu_"] a .text .title{
		font-size: var(--16px);
		margin-bottom: 10px;
	}
	[class^="service_menu_"] a .text .note{
		font-size: var(--12px);
	}
	.service_menu_dp{
		margin-bottom: 40px;
	}
	.service_menu_dp a .image{
		padding: 15px;
	}
	.service_menu_dp a .image img{
		max-width: 100px;
	}
	.service_menu_list ul{
		margin-right: -20px;
	}
	.service_menu_list ul li{
		width: calc(50% - 20px);
		margin-right: 20px;
	}
	.service_menu_list ul li:nth-child(n+3) {
		margin-top: 40px;
	}
	
	/*データパブリッシング*/
	.dp_head{
		font-size: var(--22px);
		margin-bottom: 20px;
		letter-spacing: 0;
	}
	.dp_service_head{
		padding: 0 30px;
	}
	.dp_service_head p{
		font-size: var(--14px);
	}
	.dp_service_head h2{
		font-size: var(--20px);
	}
	.dp_service_list ul{
		width: 100%;
		max-width: 480px;
		margin: 30px auto 0 auto;
	}
	.dp_service_list ul li{
		width: calc(50% - 30px);
		margin: 30px 15px 0 15px;
		transform:scale(1);
	}
	.dp_service_list ul li:hover{
		transform:scale(1);
	}
	.dp_service_list ul li:nth-child(2){
		top: -30px;	
	}
	.dp_service_list ul li:nth-child(3){
		top: 0;
	}
	.dp_service_list ul li:nth-child(4){
		top: -30px;
	}
	.dp_service_list ul li .icon{
		margin-bottom: 5px;
	}
	.dp_service_list ul li .icon img{
		max-width: 60px;
	}
	.dp_service_list ul li .text{
		font-size: var(--13px);
	}
	.article_dp .works_list{
		justify-content:flex-start;
	}
	
	/*取り扱いサービス リスト*/
	.service_items{
		margin: -10px -10px 0 0;
	}
	.service_items li{
		width: calc(50% - 10px);
		margin-right: 10px;
		margin-top: 10px;
		font-size: var(--13px);
		padding: 8px 10px;
	}
	.service_items li .icon{
		width: 30px;
		margin-right: 8px;
	}
	
	/*制作のステップ*/
	.service_flow dd {
		margin-left: 10px;
	}
	.service_flow_list::before {
		content: "";
		width: 15px;
		height: 100%;
		margin-left: -128px;
		display: block;
		position: absolute;
		top: 0;
		left: 120px;
		border-radius: 20px;
	}
	.service_flow_list > li:not(:last-child) {
		margin-bottom: 40px;
	}
	.service_flow_list > li dl {
		padding-left: 40px;
	}
	.service_flow_list > li dl::after {
		width: 25px;
	}
	.service_flow_list > li dl dt {
		font-size: var(--17px);
	}
	
	/*お問い合わせボタン*/
	.btn_service{
		font-size: var(--16px);
		line-height: 1.6;
	}

	
	
	/******************************************************************************************
		制作実績
	******************************************************************************************/
	.works_list li{
		width: calc(50% - 20px);
	}
	.works_list li:nth-child(n+3) {
		margin-top: 40px;
	}
	.works_list li .text{
		padding: 0 5px;
	}
	.works_list li .image{
		margin-bottom: 15px;
	}
	.works_list li .title{
		line-height: 1.6;
	}
	
	
	/*--------------------------------------------------------------------*/
	/*大口注文*/
	/*--------------------------------------------------------------------*/
	.order_ming{
		display: block;
	}
	.order_ming .image{
		width: 100%;
		margin-left: 0;
		margin-bottom: 30px;
		text-align: center;
	}
	.order_ming .text .title{
		font-size: var(--20px);
		margin-bottom: 15px;
	}
	.order_box2 p {
		color: #FFFFFF;
		font-size: var(--18px);
	}
	.order_case_list{
		display: flex;
		flex-wrap: wrap;
	}
	.order_case_list li{
		width: calc(50% - 30px);
		margin-bottom: 20px;
	}
	.order_tel{
		font-size:var(--20px);
	}

	
	/*--------------------------------------------------------------------*/
	/*XMF Remote*/
	/*--------------------------------------------------------------------*/
	.xmf_info{
		display: block;
	}
	.xmf_info .title{
		width: 100%;
		padding:10px 10px 0 10px;
		margin-right: 0;
		margin-bottom: 25px;
		text-align: center;
	}
	.xmf_info .title img{ width: 60px; } 
	.xmf_info .title::before{
		content: "";
		position: absolute;
		width: 100%;
		height: 15px;
		left: 0;
		top: 100%;
		background:linear-gradient(to top right, transparent 50%, #F077BA calc(50% + 1px) ,#F077BA 50.5%) top left/ 50.2% 100% no-repeat,
	linear-gradient(to top left, transparent 50%, #F077BA calc(50% + 1px) , #F077BA 50%) top right / 50% 100% no-repeat;
	}

	.xmf_info.security .title::before{ background:linear-gradient(to top right, transparent 50%, #F0E13C calc(50% + 1px) ,#F0E13C 50.5%) top left/ 50.2% 100% no-repeat, linear-gradient(to top left, transparent 50%, #F0E13C calc(50% + 1px) , #F0E13C 50%) top right / 50% 100% no-repeat; }
	.xmf_info.response .title::before{ background:linear-gradient(to top right, transparent 50%, #5DC2F0 calc(50% + 1px) ,#5DC2F0 50.5%) top left/ 50.2% 100% no-repeat, linear-gradient(to top left, transparent 50%, #5DC2F0 calc(50% + 1px) , #5DC2F0 50%) top right / 50% 100% no-repeat; }
	.xmf_info.ecology .title::before{ background:linear-gradient(to top right, transparent 50%, #5DBE88 calc(50% + 1px) ,#5DBE88 50.5%) top left/ 50.2% 100% no-repeat, linear-gradient(to top left, transparent 50%, #5DBE88 calc(50% + 1px) , #5DBE88 50%) top right / 50% 100% no-repeat; }

	.xmf_info .text{
		width: 100%;
		font-size: 14px;
		padding: 10px 15px 20px 15px;
	}

	.xmf_image p{
		padding: 15px;
	}
	
	/*--------------------------------------------------------------------*/
	/*LIMEX*/
	/*--------------------------------------------------------------------*/
	.limex_wrap .img_sp {
        display: block !important;
    }
    .limex_wrap .img_pc {
        display: none !important;
    }
    .limex_wrap .flex_box {
        flex-direction: column;
    }
    .limex_wrap .limex_info_box {
        padding: 25px 30px;
        order: 0;
    }
    .limex_wrap .limex_img {
        order: 3;
    }
    .limex_wrap .limex_info_box p {
        font-size: 14px;
    }
    .limex_wrap .limex_info_box .text span {
        font-size: 14px;
        padding-left: 0;
    }
    .limex_wrap .limex_item_text {
        padding: 15px 20px;
        font-size: 14px;
    }
    .limex_wrap .item-zirei {
        margin-bottom: 15px;
    }
    .limex_wrap .item-zirei p {
        font-size: 16px;
    }
    .limex_wrap .br-sp {
        display: none;
    }
    .limex_wrap .flex_item_box {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .limex_wrap .limex_item_area {
        padding: 15px 15px 5px 0;
    }
    .limex_wrap .limex_item_box {
        width: calc(50% - 15px);
        padding: 0 0 15px 15px;
    }
    .limex_wrap .limex_item_box p {
        font-size: 13px;
    }
    .limex_wrap .limex_contact {
        margin: 30px 0;
        padding: 0 10px;
    }
	
	
}


/*	SP size
*********************************************************************************************************************************/
@media screen and (max-width: 479px) {
	html{
		scroll-padding-top: 60px;
	}
	body{
		padding-top: 60px;
	}
		
	/******************************************************************************************
		ヘッダー
	******************************************************************************************/
	#header_wrap{
		height: 60px;
	}
	#header_wrap header{
		justify-content: space-between;
	}
	#header_wrap header #header_logo{
		width: 160px;
	}
	
	/*開閉メニューデザイン*/
	#g_nav{
		top:60px;
		height: calc(100% - 60px);
	}
	#g_nav .gnav_menu{
		top: 0;
		transform: translate(-50%, 0);
		padding-top: 15px;
	}
	#g_nav .gnav_menu ul li{
		letter-spacing: 0;
	}
	#g_nav .gnav_menu ul li a{
		font-size: var(--15px);
	}
	#g_nav .contact_area .contact_box{
		padding: 10px 15px;
	}
	#g_nav .contact_area .contact_box .tel{
		display: block;
		margin-top: 5px;
		margin-right: 0;
	}
	#g_nav .contact_area .contact_box .tel .note{
		width: 100%;
		padding-left: 25px;
	}
	
	/******************************************************************************************
		共通スタイル
	******************************************************************************************/
	article + article{
		margin-top: 50px;
	}
	section{
		padding: 0 5px;
		font-size: var(--14px);
	}
	section + section{
		margin-top: 40px;
	}
	
	article.article_l{
		padding: 30px 20px;
	}
	
	/******************************************************************************************
		お問い合わせ
	******************************************************************************************/
	#contact_wrap{
		padding: 30px 0;
	}
	#contact_wrap .text{
		margin: -10px 0 20px 0;
	}
	#contact_wrap .contact_area .contact_box{
		padding: 10px 15px;
	}
	#contact_wrap .contact_area .contact_box .tel{
		display: block;
		margin-top: 5px;
		margin-right: 0;
	}
	#contact_wrap .contact_area .contact_box .tel .note{
		width: 100%;
		padding-left: 25px;
	}
	
	/******************************************************************************************
		TOPページ
	******************************************************************************************/
	#top_main .top_main_logo{
		width: 220px;
		height: 220px;
		margin: 0 auto 20px auto;
	}
	#top_main #top_main_box.loaded .top_main_txt{
		font-size: var(--20px);
	}
	
	/*TOP用見出し*/
	h2.h2_top span.en{
		font-size: var(--40px);
	}
	
	/*お知らせ*/
	#top_news{
		padding: 30px 0;
	}
	
	/*企業概要*/
	#top_about{
		padding: 50px 0 0 0;
	}
	#top_about .scroll-infinity__item {
		min-width: 500px;
	}
	#top_about .scroll-infinity__list {
        margin-top: -5px;
    }
	#top_about .top_about_text p br.pc{
		display: none;
	}
	
	/*写真横スクロール*/
	#top_marquee{
		padding: 60px 0;
	}
	.top_marquee_bg{
		top: 20px;
	}
	.top_marquee_main ul li, .top_marquee_bg ul li{
		padding: 0 15px;
		width: 200px;
	}
	.top_marquee_main ul li:nth-child(2n){
		margin-top: 50px;
	}
	.top_marquee_bg ul li:nth-child(2n-1){
		margin-top: 150px;
	}
	
	/*サービス*/
	#top_works{
		padding: 30px 0;
	}
	#top_works .top_works_link_dp{
		margin-bottom: 15px;
		padding: 0;
	}
	#top_works .top_works_link_dp a{
		padding: 10px 15px;
	}
	#top_works .top_works_link_dp a .title{
		padding: 0 20px;
		font-size: var(--15px);
	}
	#top_works .top_works_link_dp a .en{
		position: absolute;
		right: 30px;
		top: 18px;
		font-size: var(--18px);
	}
	
	#top_works .top_works_link_list{
		display: block;
	}
	#top_works .top_works_link_list a{
		width: 100%;
		margin-bottom: 15px;
		padding: 10px;
	}
	#top_works .top_works_link_list a .image{
		height: 100px;
	}
	#top_works .top_works_link_list a .text{
		width: calc(100% - 45px);
		height: 80px;
	}
	#top_works .top_works_link_list a .en{
		font-size: var(--18px);
		margin-bottom: 0;
	}
	#top_works .top_works_link_list a .title{
		font-size: var(--16px);
	}
	
	/******************************************************************************************
		下層ページメニュー
	******************************************************************************************/
	.category_menu ul li{
		width: 100%;
		margin: 0;
	}
	.category_menu ul li:nth-child(n+2) {
		margin-top: 40px;
	}
	.category_menu ul li .image{
		margin-bottom: 15px;
	}
	.category_menu ul li .text .title{
		margin-bottom: 8px;
	}
	
	/******************************************************************************************
		企業情報
	******************************************************************************************/
	/*企業概要*/
	.company_profile{
		display: block;
	}
	.company_profile .logo {
		width: 100%;
		min-width: 100%;
		background: #FFFFFF;
		top: 60px;
		margin: 0;
		padding: 15px 10px;
		text-align: center;
	}
	.company_profile .logo img{
		width: 60%;
		min-width: 180px;
	}
	.company_profile .text dl{
		display: block;
	}
	.company_profile .text dl dt {
		width: 100%;
		padding: 15px 15px 5px 15px;
	}
	.company_profile .text dl dd {
		width: 100%;
		padding: 0 15px 15px 15px;
		border-top: none;
	}
	.company_profile .text dl dt:last-of-type {
		border-bottom: none;
	}
	
	/*沿革*/
	.history_timeline .image{
		top: 80px;
	}

	.history_photoarea {
		margin-top: 60px;
	}
	.history_photoarea .scroll-infinity__item {
		min-width: 1200px;
	}
	
	/*企業理念*/
	.message_philosophy{
		font-size: var(--24px);
		margin-bottom: 20px;
	}
	.message_vision{
		margin-bottom: 30px;
	}
	
	/******************************************************************************************
		事業内容
	******************************************************************************************/
	[class^="service_menu_"] a .text .title{
		margin-bottom: 8px;
	}
	.service_menu_dp a .image{
		padding: 30px 15px;
	}
	.service_menu_list ul li{
		width: 100%;
	}
	.service_menu_list ul li:nth-child(n+2) {
		margin-top: 40px;
	}
	
	/*データパブリッシング*/
	.dp_head{
		font-size: var(--19px);
	}
	.dp_service_head{
		padding: 0 5px;
	}
	.dp_service_head p{
		font-size: var(--12px);
	}
	.dp_service_head h2{
		font-size: var(--18px);
		margin-bottom: 20px;
	}
	.dp_service_list ul{
		width: 100%;
		max-width: 100%;
		margin: 20px auto 0 auto;
	}
	.dp_service_list ul li{
		width: calc(50% - 20px);
		margin: 30px 10px 0 10px;
	}
	.dp_service_list ul li .icon{
		margin-bottom: 0;
	}
	.dp_service_list ul li .icon img{
		max-width: 60px;
	}
	.dp_service_list ul li .text{
		font-size: var(--13px);
		padding: 0 10px;
		letter-spacing: -0.05em;
	}
	.article_dp .works_list{
		justify-content:flex-start;
	}
	
	
	/******************************************************************************************
		制作実績
	******************************************************************************************/
	.works_list li .category{
		font-size: var(--11px);
		margin: 0 -2px 5px -2px;
	}
	.works_list li .category span{
		padding: 0 3px;
		margin: 2px;
	}
	
}