@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table.table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

:focus {
	outline: 0;
}

/*ol, ul {list-style: none;}*/

table.table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	font-weight: normal;
	text-align: left;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: "";
}

blockquote, q {
	quotes: "" "";
}

a img {
	border: 0;
}

figure {
	margin: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

/* -------------------------------------------------------------- */

body {
	color: #333;
	font-size: small;
	font-family: "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", verdana, "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", Sans-Serif;
	line-height: 1.5;
	-webkit-text-size-adjust: none;
}

/* リンク設定
------------------------------------------------------------*/

a {
	color: #076fb1;
	text-decoration: underline;
}

a:hover {
	color: #46aeeb;
}

a:active, a:focus {
	outline: 0;
}

/* 全体
------------------------------------------------------------*/

#wrapper {
	margin: 0 auto;
	padding: 0 1%;
	width: 98%;
	position: relative;
	background: #fff;
}

.inner {
	margin: 0 auto;
	width: 100%;
}

/*************
/* ヘッダー
*************/

#header {
	/*height:30px;*/
}

#header h1 {
	/*padding:5px 0 10px 10px;*/
	font-size: 12px;
	font-weight: normal;
	padding: 0px;
}

/*************
/* WinActorロゴ
*************/

.info {
	float: left;
	margin: 30px 330px 0 10px;		/* 2024.8.6修正（上に「正規一次販売店」文字を入れるため、余白調整）2024.7.17修正（ロゴ差し替えのため、余白調整）「正規一次販売店」の文字位置調整（右寄せ）★ */
	color: #fff;
}

/*************
/* 正規一次販売店の文字
/* 2024.06追加
*************/

.partner_1 {
	text-align: right;
	padding: 15px 100px 0 0;	/* 2024.8.6修正（ATCロゴ上に「正規一次販売店」文字を入れるため、余白調整）2024.6修正（★10周年記念ロゴ用にロゴ差し替えのため、余白調整）※2024年4月1日～2025年3月31日 */
/*	padding: 42px 5px 5px 10px; */	/* 通常のWAロゴの余白 */
	margin: 10px 10px 10px 10px;
	font-size: 15px;		/* 17px->15px */
	color: #3A3A3A;			/* その他の色（黒: #000000; グレー: #808080; #646464; 群青色: #0070C0; #076FB1;）  */
}

/*************
/* ATCロゴ
*************/

.logo {
	float: right;				/* 2024.7.04修正（ATCロゴとWAロゴを左右入れ替え） */
	margin: 0 20px 5px 0;			/* 2024.8.6修正（上に「正規一次販売店」文字を入れるため、余白調整）2024.6修正（★10周年記念ロゴ用にロゴ差し替えのため、余白調整）※2024年4月1日～2025年3月31日 */
/*	margin: 20px 10px 10px 10px; */		/* 2024.6修正（ロゴ差し替えのため、余白調整）通常のWAロゴと使用する場合 */
}

.logo span {
	display: block;
}

/**************************
/* 10周年記念バナー（※2024年4月1日～2025年3月31日）
/* 2024.07.09追加
**************************/

.sticky-banner {
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 10;
}

/* バナーを閉じるボタン */
.banner-close {
	font-weight: bold;
	position: absolute;
	top: -2px;
	right: -4px;
	z-index: 99999;
	padding: 4px 8px;
	border: none;
	background-color: #f8f8f8;
	border-radius: 25px;
	cursor: pointer;
	-webkit-box-shadow: 0 0 7px rgb(0 0 0 / 40%);
	box-shadow: 0 0 7px rgb(0 0 0 / 40%);
}
/*----- ここまで -----*/

/**************************
/* 全ページにスクロールーバーを表示
/*（スクロールバーが表示されないことで、ページが左右にズレないようにするため）
/* 2024.08.08追加
**************************/
html {
	overflow-y: scroll;
}

/**************************
/* メイン画像（トップページ+サブページ）
**************************/

#mainBanner {
	margin: 10px auto 3px;
	padding: 0;
	width: 100%;
	position: relative;
	line-height: 0;
}

#mainBanner img {
	max-width: 100%;
	height: auto;
	border: 0px solid #dbdbdb;
}

/*************
メイン コンテンツ
*************/

section.content article {
	padding: 15px 10px;
	/*margin-bottom:4px;*/
	/*border:1px solid #dbdbdb;*/
	overflow: hidden;
}

* html section.content article {
	height: 1%;
}

section.content p {
	padding: 0 1.8em;	/* 2024.08.08追加（活用事例、FAQ、お問い合わせの説明文の書き出し位置調整） */
/*	margin-bottom: 5px;*/	/* 2024.08.08削除 */
}

h2 {
	margin: 20px 0;
	padding: 1.2em 1em;
	/*文字周りの余白*/
	color: b0dcfa;
	/*文字を白に*/
	border: 0px solid #aaa;
	background: #e7e7e7;
	border-radius: 0.2em;
	/*角の丸み*/
	font-weight: bold;
	color: #312450;
	font-size: 2em;
}

h3.icon2 {
	margin: 30px 0 20px 0;
	padding: 95px 0px 15px 240px;
	/*上下の余白*/
	border-bottom: 1px solid #ccc;
	font-weight: bold;
	color: #312450;
	font-size: 2em;
	font-family: "Roboto", sans-serif;
	text-align: left;
	background: url(../images/winactor_icon2.jpg) no-repeat 0px 85px;
}

h3.icon {
	margin: 30px 0 20px 0;
	padding: 93px 0px 15px 55px;
	/*上下の余白*/
	border-bottom: 1px solid #ccc;
	font-weight: bold;
	color: #312450;
	font-size: 2em;
	font-family: "Roboto", sans-serif;
	text-align: left;
	background: url(../images/winactor_icon.jpg) no-repeat 0px 85px;
}

h3.topic_icon {
	margin: 30px 0 20px 0;
	padding: 93px 0px 5px 25px;
	/*上下の余白*/
	border-bottom: 1px solid #ccc;
	font-weight: bold;
	color: #312450;
	font-size: 1.5em;
	font-family: "Roboto", sans-serif;
	text-align: left;
	background: url(../images/topic_icon.jpg) no-repeat 0px 85px;

	/*2025.10.20追加(お知らせの高さを設定し、スクロールバー表示)ここから*/
	position: sticky;
	top: 0;
	left: 0;
	border-top: none;
	/*ここまで*/
}

/*2025.10.20追加(お知らせの高さを設定し、スクロールバー表示)ここから*/
.topic_content {
	overflow-y: auto;
	height: 270px;	/*スクロールの高さ*/
	-webkit-overflow-scrolling: touch;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
/*ここまで*/

#topics table {
	padding: 5px 18px; 
	font-size: 1.3em;
}

#topics table a:hover{
	opacity:0.8;
}
section.content img {
	max-width: 100%;
	height: auto;
}

.alignleft {
	float: left;
	clear: left;
	margin: 3px 10px 10px 0;
}

.alignright {
	float: right;
	clear: right;
	margin: 20px 20px 20px 20px;
}

/*************
/* フッター
*************/

#footer {
	clear: both;
	background: #312450;
	bottom: 0;
	color: #FFFFFF;	/*白*/
	font-size: 0.85em;
	margin: 0;
	width: 100%;
	position: relative;
}

#footer a {
	color: #FFFFFF !important;	/*白*/
	text-decoration: underline;
}

#footer a:hover {
	color: #b74e91 !important;	/*白*/
	text-decoration: none;
}

#pageTop {
	margin: 0;
	padding-right: 30px;
	text-align: right;
	width: 95%;
}

* html #footer {
	height: 1%;
}

#footer .grid {
	padding: 10px 0 5px;
	margin: 0;
	background: transparent;
}

ul.footnav {
	/*float:right;
	width:650px;*/
	padding: 30px 0 30px 0;
	text-align: center;
}

ul.footnav li {
	display: inline;
	margin-bottom: 10px;
	padding: 0 7px 0 8px;
	font-size: 11px;
	border-right: 1px solid #fff; 
}

#footer a {
	color: #333;
}

#footer a:hover {
	color: #888;
}

address {
	clear: both;
	padding-bottom: 30px;
	text-align: center;
	font-style: normal;
	font-size: 10px;
	color: #fff;	/*白*/
	background: #312450;
	/*	min-width: 960px;*/
}

/* PC用
------------------------------------------------------------*/

@media print, screen and (min-width: 660px) {
	#header, #wrapper, .inner {
		width: 1000px;
		padding: 0;
		margin: 0 auto;
	}
	#wrapper {
		padding-bottom: 20px;
	}
/*************
メニュー
*************/
	#dropmenu0 {
		clear: both;
		width: 100%;
		height: 54px;
		padding: 0;
		margin: 0;
		background: #251b3e;	/* メニュー(後) */
		/* メニュー外 */
	}
	#dropmenu {
		position: relative;
		/*  height: 54px;*/
		padding: 0;
		margin: 0;
		z-index: 10;
	}
	nav#dropmenu .inner {
		width: 980px;
		padding: 0 14px;
	}
	#dropmenu .mainmenu {
		width: 195px;
		float: left;
	}
	#dropmenu .mainmenu ul {
		visibility: hidden;
	}
	#dropmenu .mainmenu li {
		position: relative;
		width: 195px;
		float: left;
		margin: 0;
		padding: 0;
		text-align: center;
		list-style: none;
	}
	/****メニューリンクあり設定****/
	#dropmenu .mainmenu li a, #dropmenu .mainmenu li p {
		display: block;
		margin: 0;
		padding: 23px 0 18px;
		font-size: 13px;
		font-weight: normal;
		line-height: 1;
		text-decoration: none;
		border-left: 1px solid #716886;
		/*91b3c3;BEB3CB*/
		border-bottom: 0px solid #716886;
		/*cbc6d1;/*cbc6d1*/
		color: #fff;
		/*メニューリンクあり文字色*/
		/*****メニューリンクあり背景*****/
		background: #312450;
	}
	#dropmenu .mainmenu li:hover>a {
		background: #b74e91;
		color: #fff;
	}
	/****メニューリンクなし設定****/
	#dropmenu .mainmenu li p {
		/*  color: #719fd3; /*9086B4*/
		color: #777;
		/*aa973bメニューリンクなし文字色*/
	}
	#dropmenu .mainmenu li.last {
		border-right: 1px solid #716886;
		/*BEB3CB;*/
	}
	#dropmenu .mainmenu>li:hover>a {
		border-radius: 0;
	}
	#dropmenu .mainmenu li ul {
		position: absolute;
		top: 100%;
		left: 0;
		list-style: none;
		margin: 0;
		border-radius: 0px;
	}
	#dropmenu .mainmenu li:last-child ul {
		left: 0%;
		width: 100%
	}
	#dropmenu .mainmenu li ul li {
		overflow: hidden;
		width: 196px;
		height: 0;
		color: #fff;
	}
	#dropmenu .mainmenu li ul li a {
		padding: 13px 15px;
		/*  background: #292071;*/
		text-align: left;
		font-size: 12px;
		font-weight: normal;
	}
	#dropmenu .mainmenu li:hover ul li {
		overflow: visible;
		height: 38px;
		border-top: 0px solid #eee;
		/*#302681*/
		border-bottom: 0px solid #9fb3ce;
		/*#725b97*/
	}
	#dropmenu .mainmenu li:hover ul li:first-child {
		border-top: 0;
	}
	#dropmenu .mainmenu li:hover ul li:last-child {
		border-bottom: 0;
	}
	#dropmenu .mainmenu li:hover ul li:last-child a {
		border-radius: 0;
	}
	nav div.panel {
		display: block !important;
		float: left;
	}
	a#menu {
		display: none;
	}
	nav#mainNav li.active a, nav#mainNav li a:hover {
		color: #fff;
		/*	background-position:0 -66px;*/
		background: #725b97;
		padding-top: 17px;
	}
	#mainBanner {
		margin-left: 15px;
	}
	#subpage #mainBanner {
		margin: 15px auto;
	}
	#main {
		float: right;
		width: 702px;
		/*	width:667px;*/
		padding-right: 18px;
	}
	#main2, #topics {
		padding: 0 18px;
	}

}

/* mediaqueries
------------------------------------------------------------*/

@media only screen and (max-width:659px) {
	* {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	nav#dropmenu {
		clear: both;
		width: 100%;
		margin: 0 auto;
		padding: 0;
		border-top: 1px solid #ccc;
		background: #eee;
		/*#f6e4cc d5dfbd 0%,#b8cb8b */
	}
	nav#dropmenu a.menu {
		width: 100%;
		display: block;
		height: 40px;
		line-height: 40px;
		font-weight: normal;
		text-align: left;
		border-bottom: 1px solid #ccc;
		background: #000;
		/*#f6e4cc*/
		color: #fff;
		/*メニューリンクあり文字色*/
	}
	nav#dropmenu a#menu span {
		padding-left: 10px;
	}
	nav#dropmenu a.menu span:before {
		content: "→ ";
	}
	nav#dropmenu a.menuOpen span:before {
		content: "↓ ";
	}
	nav#dropmenu a#menu:hover {
		cursor: pointer;
	}
	nav .panel {
		display: none;
		width: 100%;
		position: relative;
		right: 0;
		top: 0;
		z-index: 1;
		color: #afafa3;
	}
	nav#dropmenu ul li {
		float: none;
		clear: both;
		width: 100%;
		height: auto;
		line-height: 0.9;
	}
	nav#dropmenu ul li a, nav#mainNav ul li.current-menu-item li a, nav#dropmenu ul li p {
		display: block;
		padding: 10px;
		text-align: left;
		border-bottom: 1px dashed #ccc;
		visibility: visible;
	}
	nav#dropmenu li ul li a {
		display: block;
		padding: 10px 30px;
		text-align: left;
	}
	nav#dropmenu ul li a span {
		padding-left: 10px;
	}
	nav#dropmenu ul li:first-child a {
		border-top: 0px solid #e4e4e4;
	}
	/*	nav#dropmenu ul li:last-child a{border:0;}*/
	nav#dropmenu ul li.active a {
		color: #716a9f;
	}
	nav div.panel {
		float: none;
	}
	#subpage #mainBanner {
		max-width: 668px;
	}
	#footer .grid, #footer ul.footnav {
		float: none;
		width: 100%;
		text-align: center;
	}
	ul.footnav li {
		float: none;
		display: inline-block;
	}
	#footer {
		max-width: 659px;
	}
	address {
		max-width: 659px;
	}
}

/* スマートフォン 横(ランドスケープ) */

@media only screen and (max-width:640px) {
	#header {
		height: auto;
		padding-bottom: 20px;
	}
	#header h1, .logo, .info {
		text-align: center;
	}
	.info {
		clear: both;
		width: 100%;
		float: none;
		margin: 10px 0 0 0;
	}
	.logo {
		display: none;
	}
	.partner_1 {
		display: none;		/* 2024.7.19追加 */
	}
	.box img {
		float: left;
		margin-right: 5px;
	}
	.alignleft, .alignright {
		float: none;
		display: block;
		margin: 0 auto 10px;
	}
	#gallery .grid {
		float: left;
	}
}

/* スマートフォン 縦(ポートレート) */

@media only screen and (max-width:480px) {
	.grid {
		width: 100%;
	}
	.box img {
		max-width: 100px;
	}
	#mainBanner h2, #mainBanner p {
		font-size: 80%;
	}
}