
@primary-color:            #3e4750;
@primary-variant-color:    #000000;
@secondary-color:          #3667d5;
@secondary-variant-color:  #2573b8;
@background-color:         #FFFFFF;
@background-variant-color: #F8F8F8;
@text-color:               #303030;
@text-variant-color:       #F8F8F8;
@text-link-color:          #2573b8;
@text-visited-link-color:  #2573b8;
@text-hover-link-color:    #eb7a3d;
@border-color:             #C0C0C0;

@sidebar-width: 300px;
@content-width: 728px;
@header-title-height: 40px;
@header-menu-height:  20px;
@header-fixed-ad-height: 0px;

@font-family-sans-serif: "Meiryo", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", 'YuGothic', "Roboto", "Droid Sans", sans-serif;
@font-family-sans-serif-italic: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", 'YuGothic', "Roboto", "Droid Sans", sans-serif;
@font-family-serif: "Hiragino Mincho ProN", "Yu Mincho Medium", "Yu Mincho", "YuMincho", serif;
@font-family-monospace: "Consolas", "Meiryo", "Osaka−等幅", "Osaka-mono", monospace;
@font-family-datetime: "Georgia", "Times New Roman", serif;

html {
	overflow-y: scroll;
	height: 100%;
	line-height: 1.8;
	font-size: 12pt;
	font-family: @font-family-sans-serif;
	scroll-behavior: smooth;
}

body {
	height: 100%;
	margin: 0;
	overflow-wrap: break-word;
	word-break: break-word;
	line-break: strict;
	color: #303030;
	background-color: #F0F0F0;
}

hr {
	margin: 0;
	border: 0;
	border-top: 1px solid @border-color;
}

/* (余白の設定について)
   読みやすい1行の文字数は35～40文字と言われています。
   表示幅と文字数をちょうど合わせると、和字のみで構成される行では
   justify による余白調整が発生しなくなるのでさらに読みやすくなります。
   表示幅が合うようにpaddingを適切に設定することをオススメします。
   Windowsでは 72pt = 96px です。文字サイズ12ptの場合、16px になります。
   16pxの文字を40文字並べる場合の適切な幅は 640px です。
   コンテント領域が 728px の場合、表示幅が 640px になるように余白を 88px 確保するのが最適です。
   88px の余白をとるには片側 44px です。44px というのは 16px 文字の 2.75倍ですから、
   padding-left, padding-right を 2.75rem が最適余白サイズとなります。
   文字のサイズやコンテント領域を変更する場合は、このようにして余白サイズを計算してください。
*/
div.content {
	padding: 0 2.75rem;
	text-align: justify;
}
div.content-clear-padding {
	margin-left: -2.75rem;
	margin-right: -2.75rem;
}

a {
	color: @text-link-color;
	text-decoration: none;
}
a:visited {
	color: @text-visited-link-color;
}
a:hover {
	color: @text-hover-link-color;
}

/*
 * font / text control
 */
.font-normal {
	font-weight: normal;
}
.font-bold {
	font-weight: bold;
}
.smaller {
	font-size: smaller;
}
.larger {
	font-size: larger;
}
.monospace {
	font-family: monospace;
}
.datetime {
	font-family: @font-family-datetime;
}
.break-all {
	word-break: break-all;
}

@import "include/material-color.less";
@import "include/material-icons.less";
@import "include/markdown.less";
@import "include/heading.less";
@import "include/admonition.less";
@import "include/highlight.less";
@import "include/button.less";
@import "include/search.less";
@import "include/sidebar.less";
@import "include/layout.less";
@import "include/responsive.less";

div.header-fixed-ad {
	width: 728px;
	height: 90px;
	position: sticky;
	z-index: 9;
	top: calc(@header-title-height + @header-menu-height);
	background-color: @background-color;
	text-align: center;
}
div.sidebar-ad {
	text-align: center;
}
