html {
width: 100%;
height: 100%;
font-size: 62.5%;
}
body {
width: 100%;
height: 100%;
font-size: 16px;
font-size: 1.6rem;
line-height: 175%;
font-family: a-otf-ud-shin-go-pr6n,"游ゴシック体", "游ゴシック", YuGothic, メイリオ, Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "MS Pゴシック", "MS PGothic", Osaka, sans-serif;
color: #000;
background-color: #FFF; /*#dedad4*/
}
.float-clear {
clear: both;
}
a {
color: $linkCL;
text-decoration: none;
}
a:hover {
color: $linkhoverCL;
text-decoration: none;
}
hr {
border-top-color: #CCCCCC;
border-right-color: #CCCCCC;
border-bottom-color: #CCCCCC;
border-left-color: #CCCCCC;
margin-top: 10px;
margin-bottom: 10px;
}
/*スペース*/
.bt-sp10 {
margin-bottom: 10px!important;
}
.bt-sp20 {
margin-bottom: 20px!important;
}
.bt-sp30 {
margin-bottom: 30px!important;
}
.bt-sp40 {
margin-bottom: 40px!important;
}
.bt-sp80 {
margin-bottom: 80px!important;
}
/*グリッドシステムのガター調整*/
.row-0{
margin-left:0px;
margin-right:0px;
> div {
padding-right:0px;
padding-left:0px;
padding-bottom:0px;
}
}
.row-10 {
margin-left:-5px;
margin-right:-5px;
> div{
padding-right:5px;
padding-left:5px;
padding-bottom:10px;
}
}
.row-20 {
margin-left: -10px;
margin-right: -10px;
> div{
padding-right:10px;
padding-left:10px;
padding-bottom:20px;
}
}
.row-30 {
margin-left:-15px;
margin-right:-15px;
> div{
padding-right:15px;
padding-left:15px;
padding-bottom:30px;
}
}
/*比率を保って拡大・縮小処理*/
.photo-area {
overflow: hidden;
position: relative;
img {
@include fullcenter();
width: 100%;
height: auto;
}
}
.ratio-1_1:before {
content: "";
display: block;
padding-top: 100%; /* 1:1 */
}
.ratio-7_3:before {
content: "";
display: block;
padding-top: 30%; /* 7:3 */
}
.ratio-8_2:before {
content: "";
display: block;
padding-top: 20%; /* 8:2 */
}
.ratio-1_2:before {
content: "";
display: block;
padding-top: 200%; /* 1:2 */
}
.ratio-4_3:before {
content: "";
display: block;
padding-top: 75%; /* 4:3 */
}
.ratio-16_9:before {
content: "";
display: block;
padding-top: 56.25%; /* 16:9 */
}
.ratio-8_5:before {
content: "";
display: block;
padding-top: 62.5%; /* 8:5 ≒ 黄金比 */
}
.ratio-1_1,
.ratio-7_3,
.ratio-8_2,
.ratio-1_2,
.ratio-4_3,
.ratio-16_9,
.ratio-8_5 {
position: relative;
overflow: hidden;
}
/*.ratio-1_1 > img,
.ratio-7_3 > img,
.ratio-8_2 > img,
.ratio-1_2 > img,
.ratio-4_3 > img,
.ratio-16_9 > img,
.ratio-8_5 > img {
position: absolute;
top: 0;
left: 0;
}*/
/*---------------------------------------------*/
/*追加グリッド */
/*---------------------------------------------*/
.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
position: relative;
min-height: 1px;
}
.col-xs-15 {
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
@media (min-width: 768px) {
.col-sm-15 {
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
}
@media (min-width: 992px) {
.col-md-15 {
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
}
@media (min-width: 1200px) {
.col-lg-15 {
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
}
/*---------------------------------------------*/
/*白テーブル */
/*---------------------------------------------*/
.table-wite {
background-color: $baseCL;
}
.table-wite th {
background-color: $footer_copyCL;
}
.table-wite th,
.table-wite td {
border-color: #000!important;
}
/*---------------------------------------------*/
/*通常リスト */
/*---------------------------------------------*/
.nomal-ul {
> li {
margin-bottom: 20px;
}
}
/*---------------------------------------------*/
/*リストをテーブル化 */
/*---------------------------------------------*/
.list-table {
display: block;
padding: 0px;
list-style: none;
li {
width: 100%;
display: table;
> div:first-child {
display: table-cell;
padding: 10px;
}
> div:last-child {
display: table-cell;
padding: 10px;
}
}
.cell100 {
width: 100px;
}
.cell200 {
width: 200px;
}
}
.history-table {
> li {
border-bottom: 1px solid #CCC;
> div:first-child {
text-align: right;
width: 14rem;
}
}
}
@media only screen and (min-width: 992px) {
}
@media only screen and (max-width: 991px) {
}
/*---------------------------------------*/
/* youtube */
/*---------------------------------------*/
.youtube {
position: relative;
width: 100%;
padding-top: 62.5%;
}
.youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}