﻿@charset "utf-8";

/*------------------------------------------------------------------*/
/* JOOX テレビいきいき脳体操:(2025/07/16 update) */
/*------------------------------------------------------------------*/

/*-------------------------------------------------------------*/
/* 基本設定 */
/*-------------------------------------------------------------*/

*{
	margin:0px;
	padding:0px;
	border:0px;
	}

a:link{   text-decoration:none;       color:#003399;}
a:visited{text-decoration:none;       color:#007700;}
a:hover{  text-decoration:none;       color:#dd0000;}
a:active{ text-decoration:none;       color:#dd0000;}

body{
	-webkit-text-size-adjust:none;
	min-height:416px;
	font-size:12px;
	background:#ffffff;
	}


/*-------------------------------------------------------------*/
/* ヘッダー、フッター設定 */
/*-------------------------------------------------------------*/

footer{
	clear:both;
	text-align:center;
	margin:5px 10px 15px 10px;
	padding:0px 0px 10px 0px;
	line-height:20px;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	font-size:14px;
	font-weight:normal;
	font-family:Helvetica;
	color:#003300;
	}

.xxx_page_top{
	width:100%;
	margin:0px;
	padding:0px;
	text-align:right;
	}

/* PageTop Scroll-button */
#pageTop{
	width:70px;
	height:70px;
	background-image:url("../images/smp/pagetop_smp.png");
	background-repeat:no-repeat;
	background-size:70px 70px;
	display:block;
	position:fixed;
	bottom:100px;
	right:0px;
	}
#pageTop a{
	display:block;
	}
#pageTop a:hover{
	display:block;
	}



/*------------------------------------------------------------------*/
/* 本文設定 */
/*------------------------------------------------------------------*/

.wrapper{
	margin:0px;
	padding:10px;
	background-color:#ffffff;
	text-align:left;
	line-height:22px;
	font-weight:normal;
	font-size:15px;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	color:#000000;
	}

.wrapper_green{
	margin:0px;
	padding:0px;
	background-color:#d8e8b5;
	text-align:left;
	line-height:22px;
	font-weight:normal;
	font-size:15px;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	color:#000000;
	}

hr{
	color:#669933;
	background-color:#669933;
	border-style:none;
	height:1px;
	margin:10px 10px 10px 10px;
	}

h2.page_title_1{
	width:100%;
	margin:60px 0px 10px 0px;
	padding:10px 0px 10px 0px;
	border:none;
	font-weight:normal;
	font-size:18px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	line-height:24px;
	color:#ffffff;
	text-align:center;
	background-color:#4e4795;
	}

h2.page_title_2{
	width:100%;
	margin:60px 0px 10px 0px;
	padding:10px 0px 10px 0px;
	border:none;
	font-weight:normal;
	font-size:18px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	line-height:24px;
	color:#ffffff;
	text-align:center;
	background-color:#eb772f;
	}



h2.section_title_1{
	width:100%;
	margin:20px 0px 10px 0px;
	padding:10px 0px 10px 0px;
	border:none;
	font-weight:normal;
	font-size:18px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	line-height:24px;
	color:#ffffff;
	text-align:center;
	background-color:#4e4795;
	}

h2.section_title_2{
	width:100%;
	margin:20px 0px 10px 0px;
	padding:10px 0px 10px 0px;
	border:none;
	font-weight:normal;
	font-size:18px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	line-height:24px;
	color:#ffffff;
	text-align:center;
	background-color:#eb772f;
	}


h2.brain{
	padding:5px 5px 5px 0px;
	border:none;
	font-weight:normal;
	font-size:20px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	line-height:24px;
	color:#dd5500;
	}

h3.mid_title{
	padding:5px 0px 5px 0px;
	border:none;
	font-weight:normal;
	font-size:16px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	line-height:22px;
	color:#dd5500;
	}


dl.press_release{
	margin:0px 0px 10px 0px;
	padding:0px 0px 0px 0px;
	text-align:left;
	border-bottom:1px dotted #aaaaaa;
	}

dl.press_release dt{
	margin:3px 0px 0px 0px;
	padding:5px 0px 0px 5px;
	line-height:18px;
	font-size:15px;
	font-weight:bold;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	color:#336600;
	border-top:1px dotted #aaaaaa;
	}

dl.press_release dd{
	margin:0px 5px 10px 0px;
	padding:0px 0px 3px 5px;
	line-height:24px;
	font-size:15px;
	font-weight:normal;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	color:#000000;
	}


dl.main_text{
	margin:10px 0px 10px 0px;
	padding:0px 0px 0px 0px;
	text-align:left;
	}

.main_text dt{
	margin:3px 0px 3px 0px;
	padding:0px 0px 10px 5px;
	line-height:22px;
	font-size:18px;
	font-weight:bold;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	color:#336600;
	border-top:none;
	border-left:10px solid #aacc77;
	}

.main_text dt.top_border{
	margin:3px 0px 3px 0px;
	padding:10px 0px 10px 5px;
	line-height:22px;
	font-size:18px;
	font-weight:bold;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	color:#336600;
	border-top:3px dotted #aacc77;
	border-left:10px solid #aacc77;
	}

.main_text dt.line{
	margin:5px 0px 0px 0px;
	padding:3px 0px 0px 5px;
	line-height:22px;
	font-size:18px;
	font-weight:bold;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	color:#336600;
	border-top:1px solid #336600;
	border-left:none;
	}

.main_text dd{
	margin:0px 5px 10px 15px;
	padding:3px 0px 3px 5px;
	line-height:24px;
	font-size:15px;
	font-weight:normal;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	color:#000000;
	}

.main_text dd .lecture_title{
	margin:0px 0px 3px 0px;
	padding:3px 0px 3px 0px;
	line-height:20px;
	font-size:15px;
	font-weight:normal;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	color:#005500;
	}

.main_text dd small{
	line-height:18px;
	font-size:12px;
	font-weight:normal;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	color:#555555;
	}

ul.simple_list{
	margin:0px 0px 0px 20px;
	padding:0px 0px 0px 0px;
	}

ul.simple_list li{
	margin:2px 0px 2px 0px;
	line-height:20px;
	font-size:14px;
	font-weight:normal;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	list-style-position:outside;
	list-style-type:disc;
	list-style-image:url("../../img/icon-list-blue.gif");
	}

table.layout{
	border-collapse:collapse;
	margin:10px 10px 10px 10px;
	padding:0px 0px 0px 0px;
	border:none;
	}

table.layout td{
	margin:0px 0px 0px 0px;
	padding:5px 5px 5px 5px;
	line-height:20px;
	font-size:14px;
	font-weight:normal;
	font-family:HiraKakuProN-W3,"ヒラギノ角ゴ Pro W3";
	color:#000000;
	text-align:left;
	vertical-align:top;
	}

.button_green{
	width:300px;
	height:25px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:22px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:22px;
	color:#ffffff;
	text-align:center;
	background-color:#00aa33;
	border-radius:10px;
	}

.button_blue{
	width:300px;
	height:25px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:22px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:22px;
	color:#ffffff;
	text-align:center;
	background-color:#3355bb;
	border-radius:10px;
	}

.button_red{
	width:280px;
	height:25px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:24px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:18px;
	color:#ffffff;
	text-align:center;
	background-color:#dd5533;
	border-radius:10px;
	}

.btn_download{
	width:300px;
	height:25px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:22px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:22px;
	color:#ffffff;
	text-align:center;
	background-image:url("../images/smp/btn_bg_1_smp.png");
	background-repeat:repeat-y;
	border-radius:10px;
	}

.btn_download_yet{
	width:300px;
	height:25px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:22px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:18px;
	color:#ffffff;
	text-align:center;
	background-color:#aaaaaa;
	border-radius:10px;
	}

.btn_online_info{
	width:300px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:24px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:18px;
	color:#ffffff;
	text-align:center;
	background-image:url("../images/smp/btn_bg_2_smp.png");
	background-repeat:repeat-y;
	border-radius:10px;
	}

.btn_inquire{
	width:300px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:24px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:18px;
	color:#555555;
	text-align:center;
	background-image:url("../images/smp/btn_bg_3_smp.png");
	background-repeat:no-repeat;
	background-color:#ffffff;
	border:2px solid #555555;
	border-radius:10px;
	}

.online_info_2{
	width:300px;
	margin:10px auto 10px auto;
	padding:9px 0px 9px 0px;
	line-height:24px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:16px;
	color:#ffffff;
	text-align:center;
	background-color:#bb5555;
	border-radius:10px;
	}

.button_green a,
.button_blue a,
.button_red a,
.btn_download a,
.btn_online_info a,
.online_info_2 a{
	display:block;
	color:#ffffff;
	text-decoration:none;
	}

.btn_inquire a{
	display:block;
	color:#555555;
	text-decoration:none;
	}


/* GTMコンバージョンボタン用設定(2024/12/16) ----------------*/
button{
	line-height:24px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:18px;
	color:#ffffff;
	background-color:transparent;
	text-align:center;
	}
a button{
	cursor:pointer;
	}

/* GTM:End ----------------*/

img.item_photo{
	margin:0px 0px 0px 5px;
	padding:0px 0px 0px 0px;
	}

.price{
	width:130px;
	margin:5px 5px 5px 0px;
	padding:5px 5px 5px 5px;
	background-color:#336600;
	color:#ffffff;
	line-height:18px;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	font-size:15px;
	text-align:center;
	border-radius:8px;
	}

#top_movie{
	width:100%;
	max-width:1200px;
	aspect-ratio: 16 / 9;
	margin:60px auto 0px auto;
	text-align:center;
	}

#brain_movie{
	width:320px;
	height:180px;
	margin:10px auto 10px auto;
	text-align:center;
	}


/*
.movie{
    position: relative;
    width: 100vw;
    height:100vh;
	margin:0px auto 0px auto;
	border:1px solid #ddddee;
	}

.movie > iframe{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    min-width: 100%;
    min-height: 100%;
}
*/





/*------------------------------------------------------------------*/
/* セミナー設定 */
/*------------------------------------------------------------------*/

.banner{
	margin:0 auto;
	text-align:center;
	}

.banner a img{
	margin:5px auto 5px auto;
	padding:0;
	}

/*-------------------------------------------------------*/
/* GoogleMapはiframe埋め込みに変更するため以下は不要 */
/*-------------------------------------------------------*/

#map_canvas_2019-03{
	margin:0px auto 10px auto;
	width:300px;
	height:300px;
	}

#map_canvas_2018-07{
	margin:0px auto 10px auto;
	width:300px;
	height:300px;
	}

#map_canvas_2017-05{
	margin:0px auto 10px auto;
	width:300px;
	height:300px;
	}


/*-------------------------------------------------------*/
/* BTOC導入社バナー表示用 */
/*-------------------------------------------------------*/

table.banner{
	border-collapse:collapse;
	margin:10px auto 10px auto;
	padding:0px 0px 0px 0px;
	border:none;
	}

table.banner th{
	margin:0px 0px 0px 0px;
	padding:5px 5px 5px 5px;
	line-height:20px;
	font-size:15px;
	font-weight:normal;
	font-family:HiraKakuProN-W6,"ヒラギノ角ゴ Pro W6";
	background-color:#0786c9;
	color:#ffffff;
	text-align:center;
	vertical-align:middle;
	}

table.banner td{
	margin:0px 0px 0px 0px;
	padding:5px 5px 5px 5px;
	text-align:center;
	vertical-align:middle;
	}

/*-------------------------------------------------------*/
/* BTOC／運輸安全・物流DX EXPO 2023セミナー(2023/05/24) */
/*-------------------------------------------------------*/

.expo2023{
	margin:10px auto 10px auto;
	padding:10px 10px 10px 10px;
	border:solid 2px #2d92d3;
	border-radius:8px;
	text-align:center;
	}



/* 動画サムネイル・スライダー (2025/06/26) ------------------*/

ul.slider_movie{
	width:330px;
	margin:0px auto 0px auto;
	}

ul.slider_movie li{
	margin:0px 5px 0px 5px;
	}

ul.slider_movie li img{
	width:150px;
	}

ul.slider_movie li a:link,
ul.slider_movie li a:visited{
	display:block;
	opacity:1.0;
	filter:alpha(opacity=100);
	-webkit-transition: all .3s;
	transition: all .3s;
	}

ul.slider_movie li a:hover,
ul.slider_movie li a:active{
	display:block;
	opacity:0.70;
	filter:alpha(opacity=70);
	-webkit-transition: all .3s;
	transition: all .3s;
	}


/* バナー・スライダー (2025/06/26) ------------------*/

ul.slider_banner{
	width:330px;
	margin:10px auto 10px auto;
	}

ul.slider_banner li span{
	width:150px;
	height:90px;
	background-color:#ffffff;
	display:block;
	}

ul.slider_banner li span.wide img{
	width:150px;
	padding:5px 0px 5px 0px;
border:1px solid #999999;
	}

ul.slider_banner li span.tight img{
	width:150px;
	padding:12px 0px 13px 0px;
	border:1px solid #999999;
	}


/*横幅94%で左右に余白を持たせて中央寄せ*/
.slider_movie{
	width:94%;
	margin:20px auto 0px auto;
	}

/*スライダー内の画像を横幅100%に*/
.slider_movie img{
	width:100%;
	height:auto;
	}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider_movie .slick-slide{
	margin:0 10px;
	}


/*横幅94%で左右に余白を持たせて中央寄せ*/
.slider_banner{
	width:94%;
	margin:0px auto 0px auto;
	}

/*スライダー内の画像を横幅100%に*/
.slider_banner img{
	width:100%;
	height:auto;
	}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider_banner .slick-slide{
	margin:0 10px;
	}

/*矢印の設定*/
/*戻る、次へ矢印の位置*/
.slider_banner .slick-prev,
.slider_banner .slick-next{
	position: absolute; /*絶対配置にする*/
	top:20%;
	cursor: pointer; /*マウスカーソルを指マークに*/
	outline: none; /*クリックをしたら出てくる枠線を消す*/
	border-top: 2px solid #666; /*矢印の色*/
	border-right: 2px solid #666; /*矢印の色*/
	height: 15px;
	width: 15px;
	}

/*戻る、次へ矢印の位置*/
.slider_movie .slick-prev,
.slider_movie .slick-next{
	position: absolute; /*絶対配置にする*/
	top:30%;
	cursor: pointer; /*マウスカーソルを指マークに*/
	outline: none; /*クリックをしたら出てくる枠線を消す*/
	border-top: 2px solid #666; /*矢印の色*/
	border-right: 2px solid #666; /*矢印の色*/
	height: 15px;
	width: 15px;
	}

/*戻る矢印の位置と形状*/
.slick-prev{
	left:-1.5%;
	transform:rotate(-135deg);
	}

/*次へ矢印の位置と形状*/
.slick-next{
	right: -1.5%;
	transform: rotate(45deg);
	}

/*ドットナビゲーションの設定*/

.slider_banner .slick-dots{
	display:none;
	text-align:center;
	margin:10px 0px 0px 0px;
	}

.slider_movie .slick-dots{
	text-align:center;
	margin:20px 0px 0px 0px;
	}

.slider_banner .slick-dots li,
.slider_movie .slick-dots li{
	display:inline-block;
	margin:0 2px;
	}

.slick-dots button{
	color: transparent;
	outline: none;
	width:8px; /*ドットボタンのサイズ*/
	height:8px; /*ドットボタンのサイズ*/
	display:block;
	border-radius:50%;
	background:#cccccc; /*ドットボタンの色*/
	}

/*ドットボタンの現在地表示の色*/
.slick-dots .slick-active button{
	background:#333333;
	}



