﻿/*スマートフォン用CSS*/

@media screen and (max-width: 640px) {
 
.img{
max-width: 100%;
height: auto;
width:auto;
}

/*********************************************************************
Copyright AJI LLC (http://www.ksi-sd.com/golf)
ゴルフサイトryugakupro.htm の右側mainのスタイルシート
ファイル名：golf-ryugakupro-sumaho.css
2018年11月作成
*********************************************************************/

/*--------------------------------------------------------------------
記述の覚え
margin、padding :１番目(上)、２番目(右)、３番目(下)、４番目(左)
                  １番目(上下)、２番目(右左)
--------------------------------------------------------------------*/


/*--------------------------------------------------------------------
タイトル枠
--------------------------------------------------------------------*/
.main-tytol-waku{ /*各ページ共通*/
	width :100% ;
	height:auto;
	text-align:center;
	padding : 10px;
	margin : 0 ; 
/*	background-color: #00ffee; */
}

.waku-tytol-left{/**タイトルの左枠**/
        width:95%;/*340px;*/ 
	float:none;
	text-align:left;
	margin: 5px 0 0 0;
/*	background-color: #00ffee; */
}

.waku-tytol-right{/**タイトルの右枠**/
	width:95% ; /*340px; */
	float:none; /*right;*/
	margin: 5px 0 0 0;
/*	background-color: #ff00ee; */
}


/*--------------------------------------------------------------------
instr.htm用
--------------------------------------------------------------------*/

.waku-tytol-name {  /*タイトル「ゴルフ・プログラムの種類」の枠 */
	width : 90% ;
	text-align : center;
	font-size : 18px;
	color : #0000df;       
	font-family:  "ＭＳ ゴシック",sans-serif;/*"ＭＳ 明朝";*/
	font-weight: bold;
	text-shadow:1px 2px 3px #808080; /*横  縦  ぼかし  影の色*/
	padding : 18px 0 ;
	margin : 0 ; 
	background : #fff ;
	border : ridge 4px #00f;
	border-top-color: #0fd;
	border-left-color : #0fd ;
}

.pro-name {  /*プログラムの種類等の枠*/
	width : 100% ;
	text-align : center;
	font-size : 16px;  
	color : #30c;       
	font-family: "ＭＳ ゴシック",sans-serif;
	font-weight: bold;
	text-shadow:1px 2px 2px #808080; /*横  縦  ぼかし  影の色*/
	padding : 4px 0 2px 0 ;
	margin :  0 ; 
	background : #cfc  ; 
	border-top : solid 1px #0f3 ;
	border-right : solid 3px #393 ;
	border-bottom : solid 3px #393 ;
	border-left : solid 1px #0f3 ;
}

.waku-pro-100{/***幅100%のインストラクター紹介の枠***/
	width:95%;
	height:auto;
	font-size:14px;
	font-family: "ＭＳ ゴシック",sans-serif;/*ＭＳ 明朝",serif;*/
	text-align:left;
	margin:10px;
/*	background-color: #ff00ee; */
}

.pro-name-sub {
	width : 100% ;
	font-size : 15px ;  
	font-family: "ＭＳ ゴシック",sans-serif;
	font-weight: bold;
	text-align:center;
	color : #30c;       
	padding :4px 0  ;
	margin :  5px 0 ; 
	background : #eff ;    
	border-bottom : solid 2px #03f ;
	border-right : solid 2px #03f ;
}

.tytol-tan {  /*単独のタイトル 黄色系*/
	width : 100% ;
	text-align : center;
	font-size : 14px;  
	color : #000;      
	font-family: "ＭＳ ゴシック",sans-serif;
	font-weight: bold;             
	line-height : 20px ; 
	letter-spacing: 5px ;
	padding : 2px 0 ;
	margin : 8px 0 ; 
	background : #ffc  ; 
	border-top : solid 1px #fc0 ;
	border-right : solid 2px #fc0 ;
	border-bottom : solid 2px #ffcc00 ;
	border-left : solid 1px #fc0 ;
}

.waku-pro-image-left{
	width:40%  ;
	text-align:right;
	float:left;
	padding:0 ;
	margin:0 ;
}

.waku-pro-image-right{
	width:40%  ;
	text-align:left;
	float:right;
	padding:0 ;
	margin:0 ;
}

.waku-pro-left{
	width:50%  ;
	text-align:right;
	float:left;
	padding:0;
	margin:0;
}

.waku-pro-right{
	width:50%  ;
	text-align:left;
	float:right;
	padding:0;
	margin:0;
}



/*--------------------------------------------------------------------
インデントの設定 1行目に字下げ
--------------------------------------------------------------------*/
.indent2_1 {
	margin-left:2em;
	text-indent:1em;
}

.indent1{/*1行目を1字下げ*/
	text-indent:1em;
}

.indent-1{/*2行目以降を1字下げ*/
	padding-left:1em;	
	text-indent:-1em;
}

.indent-2{/*2行目以降を2字下げ*/
	padding-left:2em;	
	text-indent:-2em;
}

.indent-3{/*2行目以降を3字下げ*/
	padding-left:3em;	
	text-indent:-3em;
}

.indent-4{/*2行目以降を4字下げ*/
	padding-left:4em;	
	text-indent:-4em;
}

/*--------------------------------------------------------------------
テーブル
--------------------------------------------------------------------*/
/* ▼table-pro1  表全体の装飾▼ */
.table-pro1 { /*「中・長期プログラム」のテーブル*/
	width:100%;
	font-size : 14px;  
	color : #000;      
	font-family: "ＭＳ ゴシック",sans-serif;
	border-collapse: collapse;
	border: 1px #00f solid;
}

.table-pro1 thead th {
	text-align:center;
	border-bottom: 3px double #00f;
 	background: #eff;
	display:none;
}

.table-pro1-thead {
	width:100%;
	height:auto;/*50px;*/
	text-align:center;
	font-size : 14px;  
	color : #000;      
	font-family: "ＭＳ ゴシック",sans-serif;
	font-weight:bold;
/*	vertical-align:bottom; */
	border: 1px solid #00f;
 	background: #eff;
	padding:10px 0;
	margin:-2px 0 5px -1px;
	display:inline-block;  /*none*/
}

.table-pro1 th,
.table-pro1 td{
	padding: 0.7em 0.5em ;
	border:1px solid #00f;
	display:block;
}

.table-pro1 tr:first-child td {
	border-top: 1px solid #00f;
}

.table-pro1 tbody td{
	text-align : left;
	vertical-align:top;/*baseline;*/
	font-size:12px;
	font-family: "ＭＳ ゴシック",sans-serif;
	line-height: 1.5em;
	border:1px solid #00f;
 	background: #fff;
	display:block;
}

.table-pro1 tbody td:hover {
     background: #afc;
     cursor:pointer;  
}

/* ▼table-pro2 表全体の装飾▼ */
.table-pro2 { /*「特別プログラム」のテーブル*/
	width:100%;
	font-size : 14px;  
	color : #000;      
	font-family: "ＭＳ ゴシック",sans-serif;
	border-collapse: collapse;
	border: 2px #00f solid;
	background: #fff;
}

.table-pro2 thead th {
	width:100%;
	text-align:center;
	width:auto;
	border-bottom: 3px double #00f;
 	background: #eff; 
}

.table-pro2 th,
.table-pro2 td{
	width:100%;
	padding: 0.7em 0.5em ;
	border:1px solid #00f;
}
.table-pro2 tbody th{
	width:10%;
	background: #cfc; 
}
.table-pro2 tbody td.width-50{
	width:100%;
}

.table-pro2 tbody td{
	text-align : left;
/*	vertical-align:top;/*baseline;*/
	line-height: 1.5em;
 	background: #fff;
	border:1px solid #00f;
}

.table-pro2 tbody tr :hover {
	background: #cfc;
	cursor:pointer; 
}

/*--------------------------------------------------------------------
イメージの設定
--------------------------------------------------------------------*/
.image-ty1{ /*「ゴルフ留学プログラム」画像 */
	width:312px;
	height:33px;
	margin:10px 10px 10px 30px;
	float:left;
}

.image-pro-left{
	width:auto;
	text-align:right;
	float:left;
	margin:0 10px 5px 0; 
}

.image-pro-right{
	width:auto;
	float:right;
	text-align:left;
	margin:0 0 5px 10px; 
}

.image-waku-100{/***幅100%の画像枠(この中に画像を複数入れる)***/
	display:inline-block;
	width:100%;
	height:auto;
	margin:10px;
	text-align:center;
}

/* ▼キャプション付き画像全体を囲むボックスの装飾 */
figure {
/*	float:left;*/
    display: inline-block;
    margin: 0px 3px 7px 0px; /* 外側に余白を追加(※右に3px・下に7px) */
    background-color: none;  /* 背景色 */
}

/* ▼画像に対する装飾 */
figure img {
    display: block;          /* 余計な余白が出ないようにする */
    margin: 0 10px 5px 0; /* 下側に5pxの余白を追加 */
}

/* ▼キャプションに対する装飾 */
figcaption {
	font-size: 0.9em;        /* 文字サイズを90%に */
	text-align: center;      
	line-height:1.2em;
/*	text-indent:-1.8em;*/
}

.image-boll{  /*boll.pngの大きさ*/
	width:18px;
	height:aut;
}

.image-line1{
	width:100%;
	height:2px;
	margin:5px 0;
}

.image-ty1{ /*「ゴルフ留学プログラム」画像 */
	width:312px;
	height:33px;
	margin:10px;
	float:left;
}


.migi-yose{ /*margin="right" に対応 */
	width:90%;
	margin:10px 20px;
	font-size : 13px;  
	color : #000;
	font-family: "ＭＳ ゴシック",sans-serif;
	text-align:right;
}
.space-5{
	width:100%;
	height:5px;
}

.space-10{
	width:100%;
	height:10px;
}

.space-15{
	width:100%;
	height:15px;
}

.space-20{
	width:100%;
	height:20px;
}
}
