@CHARSET "UTF-8";


/* cleaning */

#technology main > .article::after {
	width: 100%;
	height: 1px;
	line-height: 1px;
	clear: both;
	display: block;
	content: '';
}



/* intersection */

#technology main > article.narrow > *:not(figure):not(iframe),
#technology main > .article.narrow > *:not(figure):not(iframe) {
    width: 100%;
    box-sizing: border-box;
    padding-right: 20px;
    padding-left: 20px;
}
#technology article .bordered {
    border-style: solid;
}

#technology article h1 {
    width: 100%;
    font-size: 20pt;
    text-align: left;
    color: #333333;
    padding-bottom: 20px;
    line-height: 1.5;
}
#technology article h2 {
    font-size: 22pt;
} 
#technology article h3 {
    font-size: 15pt;
    margin-bottom: 15px;
    line-height: 30pt;
}

#technology article p {
    font-size: 12pt;
    line-height: 1.6;
}

#technology article .layout_content div.left.description {
    width: 60%;
    padding-left: 0;
    padding-right: 60px;
}

#technology article .layout_content div.right.description {
    width: 60%;
    padding-left: 60px;
    padding-right: 0;
}

#technology article .layout_content div.left.image,
#technology article .layout_content div.right.image {
    width: 40%;
    padding-left: 0;
    padding-right: 0;
    padding-top: 65px;
}
#technology article .layout_content div.right.image.no__top {
    padding-top: 0;
}

#technology article .ico,
#technology div.article .ico {
    margin-left: 0;
    padding-left: 130px;
    height: 130px;
    background-repeat: no-repeat;
    background-size: 110px;
    background-position: 0 50%;
    line-height: 130px;      
}
#technology article .ico > span,
#technology div.article .ico > span {
    line-height: 1.5;
    vertical-align: middle;
    display: inline-block;
}

#technology article ul {
	margin: 0 0 0 15px;
	padding-top: 10px;
}
#technology article ul.from_left {
	padding-left: 8%;
    padding-right: 15%;
}
#technology article ul li {
	list-style-type: square;
	margin-bottom: 5px;
	list-style-position: outside;
}
#technology article ul.technology {
    display: flex;
    flex-wrap: wrap;
}
#technology article ul.technology li {
    list-style-type: none;
    padding: 2%;
    box-sizing: border-box;
    flex-basis: 50%;
    flex-grow: 1;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: flex-start;
    align-self: baseline;
}

#technology article ul.technology li.blink {
    -webkit-animation: blinked_animation 5s ease-in;
    -moz-animation: blinked_animation 5s ease-in;
    -o-animation: blinked_animation 5s ease-in;
    animation: blinked_animation 5s ease-in;
  }
  
  @-webkit-keyframes blinked_animation {
    0%, 49% {
      background-color: #efefef;
    }
    50%, 100% {
      background-color: #ffffff;
    }
  }

#technology article ul.technology li p.description {
    box-sizing: border-box;
    padding: 0 2% 5px 2%;
}
#technology article ul.technology li p.description a.more {
    font-style: italic;
    color: #336699;
    font-weight: bold;
}
#technology article ul.technology li div.card {
    min-width: 130px;
    min-height: 200px;
    display: inline-block;
    box-sizing: border-box;
    border-radius: 5px;
    background-size: cover;
    background-repeat: no-repeat;
}
#technology article ul.basic li div.card {
    border: 3px solid #b3b3b3;
}
#technology article ul.middle li div.card {
    border: 3px solid #70ba6f;
}
#technology article ul.high li div.card {
    border: 3px solid #9ec6eb;
}
#technology article .technology_1 {
    background-image:url('../images/technology/configurator/technology_1.svg')
}
#technology article .technology_5 {
    background-image:url('../images/technology/configurator/technology_5.svg')
}
#technology article .technology_10 {
    background-image:url('../images/technology/configurator/technology_10.svg')
}
#technology article .technology_15 {
    background-image:url('../images/technology/configurator/technology_15.svg')
}
#technology article .technology_16 {
    background-image:url('../images/technology/configurator/technology_16.svg')
}
#technology article .technology_20 {
    background-image:url('../images/technology/configurator/technology_20.svg')
}
#technology article .technology_25 {
    background-image:url('../images/technology/configurator/technology_25.svg')
}
#technology article .technology_30 {
    background-image:url('../images/technology/configurator/technology_30.svg')
}
#technology article .technology_35 {
    background-image:url('../images/technology/configurator/technology_35.svg')
}
#technology article .technology_40 {
    background-image:url('../images/technology/configurator/technology_40.svg')
}
#technology article .technology_60 {
    background-image:url('../images/technology/configurator/technology_60.svg')
}
#technology article .technology_65 {
    background-image:url('../images/technology/configurator/technology_65.svg')
}
#technology article .technology_70 {
    background-image:url('../images/technology/configurator/technology_70.svg')
}


.ico_brickhouse {
    background-image: url('../images/technology/brickhouse/ico.svg');
}
.ico_ionichouse {
    background-image: url('../images/technology/ionichouse/ico.svg');
}
.ico_floorheating {
    background-image: url('../images/technology/floorheating/ico.svg');
}
.ico_heatpump {
    background-image: url('../images/technology/heatpump/ico.svg');
}
.ico_fve {
    background-image: url('../images/technology/fve/ico.svg');
}
.ico_smarthouse {
    background-image: url('../images/technology/smarthouse/ico.svg');
}
.ico_rainwater {
    background-image: url('../images/technology/rainwater/ico.svg');
}
.ico_bathroom {
    background-image: url('../images/technology/bathroom/ico.svg');
}
.ico_recuperation {
    background-image: url('../images/technology/recuperation/ico.svg');
}
.ico_cooling {
    background-image: url('../images/technology/cooling/ico.svg');
}
.ico_ionichouse {
    background-image: url('../images/technology/ionichouse/ico.svg');
}

article .layout_content img {
    width: 100%;
}

#technology a.button.more {
    background: none;
    margin-top: 20px;
    margin-bottom: 40px;
}
#technology a.button.more > span:first-child {
    padding: 10px 15px;
    font-size: 14pt;
    background-color: #e6e6e6;
    color: #000000;
    border: none;
    border-radius: 7px;
    margin-right: 5px;
}
#technology a.button.more > span:last-child {
    padding: 10px 15px;
    font-size: 14pt;
    background-color: #ffcc01;
    color: #000000;
    border: none;
    border-radius: 7px;
}

#technology .extra_menu {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin-top: 100px;
}
#technology .extra_menu > div {
    flex-basis: 32%;
    text-align: center;
}
#technology .extra_menu > div > a {
    display: block;
    padding-top: 120px;
    font-size: 12pt;
    background-position: 50% 0;
    background-repeat: no-repeat;
}
#technology a.technology_pack_10 { 
    background-image: url('../images/technology/configurator/techpack_10.svg')
}
#technology a.technology_pack_15 {
    background-image: url('../images/technology/configurator/techpack_15.svg')
}
#technology a.technology_pack_20 {
    background-image: url('../images/technology/configurator/techpack_20.svg')
}
#technology .extra_menu > div > a:hover span,
#technology .extra_menu > div > a:hover span i,
#technology a.button.more:hover span {
    color: #666666;
}
#technology .extra_menu > div > a > span:first-child {
    display: block;
    padding: 5px;
    background-color: #e6e6e6;
    border-radius: 7px;
    margin-bottom: 5px;
}
#technology .extra_menu > div > a > span:last-child {    
    display: block;
    padding: 10px 15px;
    font-size: 18pt;
    background-color: #ffcc01;
    color: #000000;
    border: none;
    border-radius: 7px;
}


/* technology detail */

/*
#technology-detail main > article.thin > *:not(figure):not(iframe),
#technology-detail main > .article.thin > *:not(figure):not(iframe) {
    margin-bottom: 40px;
}
*/

#technology-detail h1 {
    font-size: 32pt;
    margin-bottom: 20px;
}

#technology-detail h2,
#technology-detail h2.ico {
    font-size: 23pt;
    margin-top: 60px;
    margin-bottom: 15px;
    line-height: 30pt;
    box-sizing: border-box;
}
#technology-detail h2.ico {
    padding-left: 40px;
    background-size: 30px;
}

#technology-detail h3 {
    font-size: 19pt;
    margin-top: 0;
    margin-bottom: 15px;
    line-height: 30pt;
}

#technology-detail article .layout_content p {
    font-size: 14pt;
    line-height: 24pt;
    padding-bottom: 20px;
}

#technology-detail article .layout_content p + ul {
    margin-top: -20px;
    margin-bottom: 40px;
}

#technology-detail article .layout_content ul {
    padding-left: 10%;
}

#technology-detail article .layout_content img {
    margin-top: 20px;
}

#technology-detail article .layout_content img {
    margin-bottom: 20px;
}

#technology-detail article h1.ico,
#technology-detail div.article h1.ico {
    height: 130px;
    background-repeat: no-repeat;
    padding: 0 0 0 150px;
    line-height: 130px;
    box-sizing: border-box;
}